@kortix/ui 0.0.0-stage → 0.14.4

package/dist/files/renderers/pdf/pdf-viewer.js

@@ -0,0 +1,1352 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useTranslations } from '../../../i18n/index.js';
+import { createPluginRegistration, refreshPages } from '@embedpdf/core';
+import { EmbedPDF, useRegistry } from '@embedpdf/core/react';
+import { DocumentManagerPluginPackage, useActiveDocument, useDocumentManagerCapability, } from '@embedpdf/plugin-document-manager/react';
+import { GlobalPointerProvider, InteractionManagerPluginPackage, PagePointerProvider, } from '@embedpdf/plugin-interaction-manager/react';
+import { RenderLayer, RenderPluginPackage } from '@embedpdf/plugin-render/react';
+import { Rotate, RotatePluginPackage } from '@embedpdf/plugin-rotate/react';
+import { ScrollPluginPackage, ScrollStrategy, useScroll, useScrollPlugin, } from '@embedpdf/plugin-scroll/react';
+import { SearchLayer, SearchPluginPackage, useSearch } from '@embedpdf/plugin-search/react';
+import { CopyToClipboard, SelectionPluginPackage, useSelectionCapability, useSelectionPlugin, } from '@embedpdf/plugin-selection/react';
+import { ThumbImg, ThumbnailPluginPackage, useThumbnailCapability, useThumbnailPlugin, } from '@embedpdf/plugin-thumbnail/react';
+import { TilingLayer, TilingPluginPackage } from '@embedpdf/plugin-tiling/react';
+import { useIsViewportGated, useViewportCapability, useViewportElement, useViewportRef, ViewportElementContext, ViewportPluginPackage, } from '@embedpdf/plugin-viewport/react';
+import { useZoom, ZoomMode, ZoomPluginPackage } from '@embedpdf/plugin-zoom/react';
+import { CaretLeftIcon as ChevronLeft, CaretRightIcon as ChevronRight, MinusCircleIcon as CircleMinus, PlusCircleIcon as CirclePlus, DotsThreeIcon as Ellipsis, ArrowClockwiseIcon as RotateCw, MagnifyingGlassIcon as Search, UploadIcon as Upload, } from '@phosphor-icons/react';
+import * as React from 'react';
+import { flushSync } from 'react-dom';
+import { Button } from '../../../primitives/button.js';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from '../../../primitives/dropdown-menu.js';
+import { Input } from '../../../primitives/input.js';
+import { Popover, PopoverContent, PopoverTrigger } from '../../../primitives/popover.js';
+import { Separator } from '../../../primitives/separator.js';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../../primitives/tooltip.js';
+import { DocumentViewerSidebarSkeleton, DocumentViewerThumbnailSidebar, useElementWidth, useInlineThumbnailSidebar, } from '../shared/document-viewer-sidebar.js';
+import { ScrollArea } from '../shared/scroll-area-compat.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../shared/select-compat.js';
+import { Spinner } from '../shared/spinner.js';
+import { ViewerDownloadButton } from '../shared/viewer-download-button.js';
+// Imported directly (not via the `@/features/file-viewer` barrel) to avoid a
+// module cycle: that barrel re-exports FileContentRenderer, which lazy-loads
+// PdfRenderer, which renders this file.
+import { usePreviewFit } from '../../viewer/preview-fit.js';
+import { cn } from '../../../lib/utils.js';
+import { downloadBlob } from '../../../internal/lib/utils/download.js';
+import { loadSharedPdfEngine } from './pdf-engine-loader.js';
+import { SidebarGlyph as PanelLeft } from '../../../icons/sidebar-toggle.js';
+const DEFAULT_ZOOM = 1;
+const ZOOM_OPTIONS = [0.1, 0.25, 0.5, 0.75, 1, 1.25, 1.5, 2];
+const PAGE_GAP = 24;
+const THUMBNAIL_PAGE_WIDTH = 92;
+const THUMBNAIL_IMAGE_PADDING = 8;
+const THUMBNAIL_WIDTH = THUMBNAIL_PAGE_WIDTH + THUMBNAIL_IMAGE_PADDING * 2;
+const THUMBNAIL_LABEL_HEIGHT = 24;
+const THUMBNAIL_GAP = 12;
+const THUMBNAIL_PANE_PADDING_Y = 16;
+const THUMBNAIL_SIDEBAR_WIDTH_CLASS = 'w-40';
+const THUMBNAIL_SIDEBAR_CLOSED_CLASS = '-ml-40';
+const PAGE_BASE_RENDER_MAX_SCALE = 1;
+const PAGE_BASE_RENDER_DPR = 1;
+const PDF_SEARCH_DEBOUNCE_MS = 300;
+const TEXT_SELECTION_BACKGROUND = 'color-mix(in srgb, var(--kortix-blue) 14%, transparent)';
+const THUMBNAIL_FOCUS_RING_CLASS = 'group-focus-visible/pdf-thumbnail-sidebar:ring-2 group-focus-visible/pdf-thumbnail-sidebar:ring-ring group-focus-visible/pdf-thumbnail-sidebar:ring-offset-1 group-focus-visible/pdf-thumbnail-sidebar:ring-offset-background';
+/**
+ * Picks the zoom plugin's initial level. `fitOnOpen` is the one guarded
+ * global-default flip point in this file — keep this an explicit function
+ * (not inlined at the call site) so it stays independently testable: a
+ * regression here would silently change the zoom every existing caller opens
+ * at.
+ */
+export function selectPdfZoomLevel(fitOnOpen, defaultZoomLevel) {
+    return fitOnOpen ? ZoomMode.FitPage : defaultZoomLevel;
+}
+function getPageIndexRange(from, to) {
+    const start = Math.min(from, to);
+    const end = Math.max(from, to);
+    const range = new Set();
+    for (let pageIndex = start; pageIndex <= end; pageIndex += 1) {
+        range.add(pageIndex);
+    }
+    return range;
+}
+function arePageIndexSetsEqual(left, right) {
+    if (left.size !== right.size)
+        return false;
+    for (const value of left) {
+        if (!right.has(value))
+            return false;
+    }
+    return true;
+}
+function normalizeRotation(rotation) {
+    return (((rotation % 4) + 4) % 4);
+}
+function useSharedPdfEngine() {
+    const [engine, setEngine] = React.useState(null);
+    const [error, setError] = React.useState(null);
+    React.useEffect(() => {
+        let cancelled = false;
+        loadSharedPdfEngine().then((loadedEngine) => {
+            if (!cancelled)
+                setEngine(loadedEngine);
+        }, (loadError) => {
+            if (!cancelled)
+                setError(loadError);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+    return { engine, error };
+}
+function rotationToDegrees(rotation) {
+    return rotation * 90;
+}
+function normalizeDegrees(rotation) {
+    return ((rotation % 360) + 360) % 360;
+}
+function ensurePdfExtension(fileName) {
+    return fileName.toLowerCase().endsWith('.pdf') ? fileName : `${fileName}.pdf`;
+}
+function getPdfDownloadFileName(fileName, src) {
+    if (fileName?.trim())
+        return ensurePdfExtension(fileName.trim());
+    const pathname = src.split(/[?#]/)[0] ?? '';
+    const rawName = pathname.split('/').pop() || 'document.pdf';
+    try {
+        return ensurePdfExtension(decodeURIComponent(rawName));
+    }
+    catch {
+        return ensurePdfExtension(rawName);
+    }
+}
+function getRotatedPdfDownloadFileName(fileName) {
+    return fileName.replace(/\.pdf$/i, '-rotated.pdf');
+}
+async function downloadPdfWithPageRotations({ fileName, pageRotationDeltas, src, }) {
+    const response = await fetch(src);
+    if (!response.ok) {
+        throw new Error(`Failed to download PDF (${response.status})`);
+    }
+    if (pageRotationDeltas.size === 0) {
+        downloadBlob(await response.blob(), fileName);
+        return;
+    }
+    const [{ PDFDocument, degrees }, pdfBytes] = await Promise.all([
+        import('pdf-lib'),
+        response.arrayBuffer(),
+    ]);
+    const pdfDocument = await PDFDocument.load(pdfBytes);
+    pdfDocument.getPages().forEach((page, pageIndex) => {
+        const rotationDelta = pageRotationDeltas.get(pageIndex);
+        if (!rotationDelta)
+            return;
+        page.setRotation(degrees(normalizeDegrees(page.getRotation().angle + rotationToDegrees(rotationDelta))));
+    });
+    const nextPdfBytes = await pdfDocument.save();
+    const nextPdfBuffer = new ArrayBuffer(nextPdfBytes.byteLength);
+    new Uint8Array(nextPdfBuffer).set(nextPdfBytes);
+    downloadBlob(new Blob([nextPdfBuffer], { type: 'application/pdf' }), getRotatedPdfDownloadFileName(fileName));
+}
+/**
+ * A page's on-screen size once its own rotation is applied — a quarter turn
+ * swaps width and height. Delegates to `getRotatedDimensions` further down
+ * this file (a hoisted function declaration, so the call is valid regardless
+ * of definition order) rather than re-deriving the swap — that helper is
+ * already this file's one convention for "does this rotation swap the
+ * axes", also used by `getRotatedPageDimensions` and the page-rotate
+ * transitions below. Exported so the page-1 size report (see
+ * `PDFViewerDocumentLoader`) is independently testable.
+ */
+export function getRotatedPageSize(size, rotation) {
+    return getRotatedDimensions({ width: size.width, height: size.height, rotation });
+}
+function getThumbnailMetaForPage({ page, pageIndex, rotation, width, imagePadding, labelHeight, top, }) {
+    const innerWidth = Math.max(1, width - imagePadding * 2);
+    const pageWidth = rotation % 2 === 1 ? page.size.height : page.size.width;
+    const pageHeight = rotation % 2 === 1 ? page.size.width : page.size.height;
+    const imageHeight = Math.round(innerWidth * (pageHeight / pageWidth));
+    const wrapperHeight = imagePadding + imageHeight + imagePadding + labelHeight;
+    return {
+        pageIndex,
+        width: innerWidth,
+        height: imageHeight,
+        wrapperHeight,
+        top,
+        labelHeight,
+        padding: imagePadding,
+    };
+}
+function buildThumbnailLayout({ basePageRotations, pageRotationDeltas, pdfDocument, width, gap, imagePadding, labelHeight, paddingY, }) {
+    if (!pdfDocument)
+        return null;
+    let top = paddingY;
+    const items = pdfDocument.pages.map((page, pageIndex) => {
+        const basePageRotation = basePageRotations[pageIndex] ?? normalizeRotation(page.rotation);
+        const pageRotation = normalizeRotation(basePageRotation + (pageRotationDeltas.get(pageIndex) ?? 0));
+        const meta = getThumbnailMetaForPage({
+            page,
+            pageIndex,
+            rotation: pageRotation,
+            width,
+            imagePadding,
+            labelHeight,
+            top,
+        });
+        top += meta.wrapperHeight + gap;
+        return meta;
+    });
+    return {
+        items,
+        totalHeight: items.length ? top - gap + paddingY : paddingY * 2,
+    };
+}
+function getVisibleThumbnailItems({ buffer, clientHeight, items, scrollTop, }) {
+    if (items.length === 0)
+        return [];
+    if (clientHeight <= 0)
+        return items.slice(0, Math.min(items.length, buffer * 2));
+    const viewportBottom = scrollTop + clientHeight;
+    let start = items.findIndex((item) => item.top + item.wrapperHeight >= scrollTop);
+    if (start === -1)
+        start = items.length - 1;
+    let end = start;
+    while (end < items.length && items[end].top <= viewportBottom) {
+        end += 1;
+    }
+    return items.slice(Math.max(0, start - buffer), Math.min(items.length, end + buffer));
+}
+function PDFViewerLoadingSkeleton({ sidebarOpen, sidebarInline, }) {
+    return (_jsxs("div", { className: "bg-muted/30 absolute inset-0 z-20 flex", children: [sidebarOpen ? (_jsx(DocumentViewerSidebarSkeleton, { className: THUMBNAIL_SIDEBAR_WIDTH_CLASS, inline: sidebarInline })) : null, _jsx("div", { className: "grid min-w-0 flex-1 place-items-center", children: _jsx(Spinner, { className: "size-4" }) })] }));
+}
+// Rendered while the engine or document is not ready: same frame as the
+// full viewer, with only the upload control usable.
+function PDFViewerFallbackShell({ className, showToolbar, showUpload, sidebarOpen, state, onUploadFile, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    return (_jsxs("div", { "data-slot": "pdf-viewer", className: cn('bg-background flex h-full max-h-full min-h-0 w-full flex-col overflow-hidden', className), children: [showToolbar ? (_jsx("div", { className: "bg-background flex min-h-12 flex-wrap items-center justify-end gap-2 border-b px-3 py-2", children: showUpload && onUploadFile ? (_jsx(PDFViewerFileActionsMenu, { onUploadFile: onUploadFile, showUpload: true })) : null })) : null, _jsxs("div", { className: "bg-muted/30 relative flex min-h-0 flex-1 overflow-hidden", children: [state === 'loading' ? (_jsx(PDFViewerLoadingSkeleton, { sidebarInline: true, sidebarOpen: sidebarOpen })) : null, state === 'error' ? (_jsx("div", { className: "bg-background text-muted-foreground absolute inset-0 z-20 grid place-items-center p-6 text-sm", children: tI18nComplete.raw('textc009fe87348b') })) : null, state === 'empty' ? (_jsx("div", { className: "bg-background text-muted-foreground absolute inset-0 z-20 grid place-items-center p-6 text-center text-sm", children: _jsxs("div", { className: "max-w-sm space-y-3", children: [_jsx("div", { className: "text-foreground font-medium", children: tI18nComplete.raw('textfb31480e7db1') }), _jsxs("div", { children: [tI18nComplete.raw('textc72772b1c8d9'), " ", _jsx("code", { children: "src" }), ' ', tI18nComplete.raw('textf7552f3489ab')] })] }) })) : null] })] }));
+}
+function ToolbarTooltip({ label, children }) {
+    return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { className: "inline-flex", children: children }) }), _jsx(TooltipContent, { side: "bottom", children: label })] }));
+}
+/**
+ * Upload is the only action left behind a menu here. Download is a visible
+ * button (`ViewerDownloadButton`) in the toolbar itself, so a menu that would
+ * hold nothing but Download is not rendered at all.
+ */
+function PDFViewerFileActionsMenu({ onUploadFile, showUpload = false, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const inputRef = React.useRef(null);
+    if (!showUpload || !onUploadFile)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx("input", { ref: inputRef, type: "file", accept: "application/pdf,.pdf", className: "sr-only", tabIndex: -1, onChange: (event) => {
+                    const nextFile = event.target.files?.[0];
+                    if (nextFile) {
+                        onUploadFile(nextFile);
+                        event.currentTarget.value = '';
+                    }
+                } }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('text55a733d57ce1'), children: _jsx(Ellipsis, { className: "size-4" }) }) }), _jsx(DropdownMenuContent, { align: "end", className: "w-40", children: _jsxs(DropdownMenuItem, { onClick: () => inputRef.current?.click(), children: [_jsx(Upload, { className: "size-4" }), tI18nComplete.raw('text865e89de78d9')] }) })] })] }));
+}
+function PDFViewerPageNumberControl({ activePage, controlsDisabled, numPages, onPageChange, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const inputRef = React.useRef(null);
+    const displayPage = numPages ? activePage : 1;
+    const [isEditing, setIsEditing] = React.useState(false);
+    const [draftPage, setDraftPage] = React.useState(() => String(displayPage));
+    React.useEffect(() => {
+        if (!isEditing)
+            return;
+        inputRef.current?.focus();
+        inputRef.current?.select();
+    }, [isEditing]);
+    const applyPageDraft = React.useCallback((value) => {
+        const trimmedValue = value.trim();
+        if (!trimmedValue)
+            return;
+        const parsedPage = Number(trimmedValue);
+        if (!Number.isInteger(parsedPage))
+            return;
+        onPageChange(Math.min(Math.max(parsedPage, 1), Math.max(numPages, 1)));
+    }, [numPages, onPageChange]);
+    return (_jsxs("div", { className: "text-primary flex items-center text-sm whitespace-nowrap tabular-nums", children: [_jsx("span", { children: tI18nComplete.raw('text0a30a815d67d') }), isEditing ? (_jsx(Input, { ref: inputRef, "aria-label": tI18nComplete.raw('text05fa2e3b0a10'), inputMode: "numeric", pattern: "[0-9]*", size: "sm", value: draftPage, className: "mx-1 w-14 min-w-14 rounded-md [&_[data-slot=input]]:text-center", onBlur: () => setIsEditing(false), onChange: (event) => {
+                    const nextValue = event.target.value;
+                    setDraftPage(nextValue);
+                    applyPageDraft(nextValue);
+                }, onKeyDown: (event) => {
+                    if (event.key === 'Enter' || event.key === 'Escape') {
+                        event.currentTarget.blur();
+                    }
+                } })) : (_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "font-normal", "aria-label": tI18nComplete('text8b5b847c92d6', { value0: displayPage }), disabled: controlsDisabled || !numPages, onClick: () => {
+                    setDraftPage(String(displayPage));
+                    setIsEditing(true);
+                }, children: displayPage })), _jsxs("span", { children: [tI18nComplete.raw('text28391d3bc64e'), " ", numPages || '–'] })] }));
+}
+function PDFViewerSearchControl({ documentId, controlsDisabled, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const { state, provides } = useSearch(documentId);
+    const { provides: scroll } = useScroll(documentId);
+    const [searchDraft, setSearchDraft] = React.useState('');
+    const [searchQuery, setSearchQuery] = React.useState('');
+    const [isSearching, setIsSearching] = React.useState(false);
+    const providesRef = React.useRef(provides);
+    const scrollRef = React.useRef(scroll);
+    const searchRequestIdRef = React.useRef(0);
+    const hasActiveQuery = Boolean(searchQuery.trim());
+    const resultLabel = isSearching
+        ? 'Searching'
+        : !hasActiveQuery
+            ? 'No search'
+            : state.total
+                ? `${state.activeResultIndex + 1} / ${state.total}`
+                : 'No results';
+    const scrollToResult = React.useCallback((index) => {
+        const result = state.results[index];
+        if (!result || !scroll)
+            return;
+        const firstRect = result.rects[0];
+        scroll.scrollToPage({
+            pageNumber: result.pageIndex + 1,
+            ...(firstRect
+                ? {
+                    pageCoordinates: {
+                        x: firstRect.origin.x,
+                        y: firstRect.origin.y,
+                    },
+                    alignY: 30,
+                }
+                : {}),
+            behavior: 'auto',
+        });
+    }, [scroll, state.results]);
+    React.useEffect(() => {
+        providesRef.current = provides;
+        scrollRef.current = scroll;
+    }, [provides, scroll]);
+    const runSearch = React.useCallback((rawQuery) => {
+        const query = rawQuery.trim();
+        const requestId = searchRequestIdRef.current + 1;
+        searchRequestIdRef.current = requestId;
+        setSearchQuery(query);
+        const searchProvider = providesRef.current;
+        const scrollProvider = scrollRef.current;
+        if (!searchProvider) {
+            setIsSearching(false);
+            return;
+        }
+        if (!query) {
+            searchProvider.stopSearch();
+            setIsSearching(false);
+            return;
+        }
+        setIsSearching(true);
+        searchProvider.startSearch();
+        searchProvider.searchAllPages(query).wait((result) => {
+            if (searchRequestIdRef.current !== requestId)
+                return;
+            const firstResult = result.results[0];
+            if (firstResult && scrollProvider) {
+                searchProvider.goToResult(0);
+                const firstRect = firstResult.rects[0];
+                scrollProvider.scrollToPage({
+                    pageNumber: firstResult.pageIndex + 1,
+                    ...(firstRect
+                        ? {
+                            pageCoordinates: {
+                                x: firstRect.origin.x,
+                                y: firstRect.origin.y,
+                            },
+                            alignY: 30,
+                        }
+                        : {}),
+                    behavior: 'auto',
+                });
+            }
+            setIsSearching(false);
+        }, () => {
+            if (searchRequestIdRef.current !== requestId)
+                return;
+            setIsSearching(false);
+        });
+    }, []);
+    React.useEffect(() => {
+        if (!searchDraft.trim())
+            return;
+        const timeoutId = window.setTimeout(() => {
+            runSearch(searchDraft);
+        }, PDF_SEARCH_DEBOUNCE_MS);
+        return () => window.clearTimeout(timeoutId);
+    }, [runSearch, searchDraft]);
+    const handleSearchDraftChange = React.useCallback((event) => {
+        const nextDraft = event.target.value;
+        setSearchDraft(nextDraft);
+        if (nextDraft.trim()) {
+            setIsSearching(true);
+            return;
+        }
+        searchRequestIdRef.current += 1;
+        setSearchQuery('');
+        setIsSearching(false);
+        provides?.stopSearch();
+    }, [provides]);
+    const clearSearch = React.useCallback(() => {
+        searchRequestIdRef.current += 1;
+        setSearchDraft('');
+        setSearchQuery('');
+        setIsSearching(false);
+        provides?.stopSearch();
+    }, [provides]);
+    const navigate = React.useCallback((direction) => {
+        if (!provides || state.total === 0)
+            return;
+        const index = direction === 1 ? provides.nextResult() : provides.previousResult();
+        scrollToResult(index);
+    }, [provides, scrollToResult, state.total]);
+    return (_jsxs(Popover, { children: [_jsx(ToolbarTooltip, { label: tI18nComplete.raw('text38d268a10995'), children: _jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('text38d268a10995'), disabled: controlsDisabled, children: _jsx(Search, { className: "size-4" }) }) }) }), _jsx(PopoverContent, { align: "end", className: "w-72", children: _jsxs("div", { className: "space-y-3", children: [_jsx(Input, { placeholder: tI18nComplete.raw('text38d268a10995'), value: searchDraft, onChange: handleSearchDraftChange, onKeyDown: (event) => {
+                                if (event.key !== 'Enter')
+                                    return;
+                                event.preventDefault();
+                                if (event.shiftKey && state.total) {
+                                    navigate(-1);
+                                }
+                                else if (state.total) {
+                                    navigate(1);
+                                }
+                                else if (searchDraft.trim()) {
+                                    runSearch(searchDraft);
+                                }
+                            } }), _jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("div", { className: "text-muted-foreground min-w-0 text-xs tabular-nums", children: _jsx("div", { className: "truncate", children: state.total ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-primary", children: state.activeResultIndex + 1 }), ` / ${state.total}`] })) : (resultLabel) }) }), _jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [_jsx(Button, { type: "button", variant: "outline", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('text965bc32426d7'), disabled: isSearching || state.total === 0, onClick: () => navigate(-1), children: _jsx(ChevronLeft, { className: "size-4" }) }), _jsx(Button, { type: "button", variant: "outline", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('textbf56a193cb9f'), disabled: isSearching || state.total === 0, onClick: () => navigate(1), children: _jsx(ChevronRight, { className: "size-4" }) })] })] }), _jsx("div", { className: "flex justify-end", children: _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: clearSearch, children: tI18nComplete.raw('text83b12c2216ef') }) })] }) })] }));
+}
+function PDFViewerThumbnails({ basePageRotations, documentId, activePage, pageCount, pageRotationDeltas, pdfDocument, selectedPageIndexes, onSelectPage, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const thumbnailListboxId = React.useId();
+    const activeDescendantId = activePage > 0 ? `${thumbnailListboxId}-page-${activePage}` : undefined;
+    const handleKeyDown = React.useCallback((event) => {
+        if (pageCount < 1)
+            return;
+        const currentPage = activePage > 0 ? activePage : 1;
+        let nextPage = null;
+        if (event.key === 'ArrowDown') {
+            nextPage = Math.min(pageCount, currentPage + 1);
+        }
+        else if (event.key === 'ArrowUp') {
+            nextPage = Math.max(1, currentPage - 1);
+        }
+        else if (event.key === 'Home') {
+            nextPage = 1;
+        }
+        else if (event.key === 'End') {
+            nextPage = pageCount;
+        }
+        else if (event.key === ' ') {
+            event.preventDefault();
+            onSelectPage(currentPage, 'toggle');
+            return;
+        }
+        if (nextPage === null)
+            return;
+        event.preventDefault();
+        onSelectPage(nextPage, event.shiftKey ? 'range' : 'replace');
+    }, [activePage, onSelectPage, pageCount]);
+    return (_jsx(PDFViewerThumbnailScrollArea, { activeDescendantId: activeDescendantId, basePageRotations: basePageRotations, documentId: documentId, onKeyDown: handleKeyDown, pageRotationDeltas: pageRotationDeltas, pdfDocument: pdfDocument, children: (meta) => {
+            const pageNumber = meta.pageIndex + 1;
+            const isActive = pageNumber === activePage;
+            const isSelected = selectedPageIndexes.has(meta.pageIndex);
+            const imagePadding = meta.padding ?? 0;
+            const pageRotationDelta = pageRotationDeltas.get(meta.pageIndex) ?? 0;
+            const thumbnailImageStyle = pageRotationDelta % 2 === 1
+                ? {
+                    height: meta.width,
+                    transform: `rotate(${rotationToDegrees(pageRotationDelta)}deg)`,
+                    width: meta.height,
+                }
+                : {
+                    height: meta.height,
+                    transform: pageRotationDelta === 0
+                        ? undefined
+                        : `rotate(${rotationToDegrees(pageRotationDelta)}deg)`,
+                    width: meta.width,
+                };
+            return (_jsx("div", { "data-pdf-viewer-thumbnail": pageNumber, className: cn('absolute right-0 left-0 flex justify-center', isActive && 'z-10'), style: { top: meta.top, height: meta.wrapperHeight }, children: _jsxs("div", { id: `${thumbnailListboxId}-page-${pageNumber}`, role: "option", "data-pdf-viewer-thumbnail-option": pageNumber, "aria-current": isActive ? 'page' : undefined, "aria-label": `Page ${pageNumber}`, "aria-posinset": pageNumber, "aria-selected": isSelected, "aria-setsize": pageCount, "data-selected": isSelected ? '' : undefined, className: cn('hover:bg-sidebar-accent flex h-full w-full flex-col items-center justify-between rounded-md px-2 py-0 text-xs transition-shadow outline-none select-none', isActive || isSelected
+                        ? 'bg-sidebar-accent text-foreground'
+                        : 'text-muted-foreground', isActive && THUMBNAIL_FOCUS_RING_CLASS), onClick: (event) => {
+                        const mode = event.shiftKey
+                            ? 'range'
+                            : event.metaKey || event.ctrlKey
+                                ? 'toggle'
+                                : 'replace';
+                        onSelectPage(pageNumber, mode);
+                    }, children: [_jsx("span", { className: "mt-0 flex items-center justify-center overflow-hidden rounded-md bg-transparent", style: {
+                                width: meta.width + imagePadding * 2,
+                                height: meta.height + imagePadding * 2,
+                                padding: imagePadding,
+                            }, children: _jsx(ThumbImg, { documentId: documentId, meta: meta, className: "block rounded-sm object-contain", style: thumbnailImageStyle }) }), _jsx("span", { className: "flex items-center justify-center tabular-nums", style: { height: meta.labelHeight }, children: _jsx("span", { className: "flex min-w-5 items-center justify-center px-1.5 text-center leading-5", children: pageNumber }) })] }) }, meta.pageIndex));
+        } }));
+}
+function PDFViewerThumbnailScrollArea({ activeDescendantId, basePageRotations, children, documentId, onKeyDown, pageRotationDeltas, pdfDocument, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const { plugin: thumbnailPlugin } = useThumbnailPlugin();
+    const viewportRef = React.useRef(null);
+    const [viewportMetrics, setViewportMetrics] = React.useState({
+        clientHeight: 0,
+        scrollTop: 0,
+    });
+    const thumbnailScope = React.useMemo(() => thumbnailPlugin?.provides().forDocument(documentId) ?? null, [documentId, thumbnailPlugin]);
+    const windowState = React.useSyncExternalStore(React.useCallback((onStoreChange) => {
+        if (!thumbnailScope)
+            return () => undefined;
+        return thumbnailScope.onWindow(() => onStoreChange());
+    }, [thumbnailScope]), React.useCallback(() => thumbnailScope?.getWindow() ?? null, [thumbnailScope]), () => null);
+    const hasWindowState = Boolean(windowState);
+    const paddingY = thumbnailPlugin?.cfg.paddingY ?? 0;
+    const thumbnailLayout = React.useMemo(() => buildThumbnailLayout({
+        basePageRotations,
+        pageRotationDeltas,
+        pdfDocument,
+        width: thumbnailPlugin?.cfg.width ?? THUMBNAIL_WIDTH,
+        gap: thumbnailPlugin?.cfg.gap ?? THUMBNAIL_GAP,
+        imagePadding: thumbnailPlugin?.cfg.imagePadding ?? 0,
+        labelHeight: thumbnailPlugin?.cfg.labelHeight ?? THUMBNAIL_LABEL_HEIGHT,
+        paddingY,
+    }), [basePageRotations, pageRotationDeltas, pdfDocument, paddingY, thumbnailPlugin]);
+    const effectiveWindowState = React.useMemo(() => {
+        if (!thumbnailLayout)
+            return windowState;
+        const items = getVisibleThumbnailItems({
+            buffer: thumbnailPlugin?.cfg.buffer ?? 3,
+            clientHeight: viewportMetrics.clientHeight,
+            items: thumbnailLayout.items,
+            scrollTop: viewportMetrics.scrollTop,
+        });
+        return {
+            start: items[0]?.pageIndex ?? -1,
+            end: items.at(-1)?.pageIndex ?? -1,
+            items,
+            totalHeight: thumbnailLayout.totalHeight,
+        };
+    }, [thumbnailLayout, thumbnailPlugin, viewportMetrics, windowState]);
+    React.useEffect(() => {
+        const viewport = viewportRef.current;
+        if (!viewport || !thumbnailScope)
+            return;
+        const updateWindow = () => {
+            setViewportMetrics({
+                clientHeight: viewport.clientHeight,
+                scrollTop: viewport.scrollTop,
+            });
+            thumbnailScope.updateWindow(viewport.scrollTop, viewport.clientHeight);
+        };
+        viewport.addEventListener('scroll', updateWindow);
+        const frame = window.requestAnimationFrame(updateWindow);
+        return () => {
+            window.cancelAnimationFrame(frame);
+            viewport.removeEventListener('scroll', updateWindow);
+        };
+    }, [thumbnailScope]);
+    React.useEffect(() => {
+        const viewport = viewportRef.current;
+        if (!viewport || !thumbnailScope)
+            return;
+        const resizeObserver = new ResizeObserver(() => {
+            setViewportMetrics({
+                clientHeight: viewport.clientHeight,
+                scrollTop: viewport.scrollTop,
+            });
+            thumbnailScope.updateWindow(viewport.scrollTop, viewport.clientHeight);
+        });
+        resizeObserver.observe(viewport);
+        return () => resizeObserver.disconnect();
+    }, [thumbnailScope]);
+    React.useEffect(() => {
+        const viewport = viewportRef.current;
+        if (!viewport || !thumbnailScope)
+            return;
+        thumbnailScope.updateWindow(viewport.scrollTop, viewport.clientHeight);
+    }, [thumbnailLayout, thumbnailScope, windowState]);
+    React.useEffect(() => {
+        const viewport = viewportRef.current;
+        if (!viewport || !thumbnailScope || !hasWindowState)
+            return;
+        return thumbnailScope.onScrollTo(({ top, behavior }) => {
+            viewport.scrollTo({ top, behavior });
+        });
+    }, [hasWindowState, thumbnailScope]);
+    return (_jsx(ScrollArea, { className: "h-full w-full", orientation: "vertical", scrollFade: true, viewportClassName: "group/pdf-thumbnail-sidebar px-4 focus-visible:ring-0 focus-visible:ring-offset-0", viewportProps: {
+            'aria-activedescendant': activeDescendantId,
+            'aria-label': tI18nComplete.raw('text5b5a81a901e5'),
+            'aria-multiselectable': true,
+            onKeyDown,
+            onMouseDown: (event) => {
+                event.currentTarget.focus({ preventScroll: true });
+            },
+            role: 'listbox',
+            style: {
+                paddingBottom: paddingY,
+                paddingTop: paddingY,
+            },
+            tabIndex: 0,
+        }, viewportRef: viewportRef, children: _jsx("div", { className: "relative", style: { height: effectiveWindowState?.totalHeight ?? 0 }, children: effectiveWindowState?.items.map((meta) => children(meta)) }) }));
+}
+function PDFViewerScrollAreaViewport({ children, className, documentId, }) {
+    const viewportRef = useViewportRef(documentId);
+    const { provides: viewport } = useViewportCapability();
+    const isGated = useIsViewportGated(documentId);
+    const viewportGap = viewport?.getViewportGap() ?? 0;
+    return (_jsx(ViewportElementContext.Provider, { value: viewportRef, children: _jsx(ScrollArea, { className: className, orientation: "both", viewportClassName: "relative select-none selection:bg-transparent selection:text-inherit", viewportProps: {
+                style: {
+                    padding: viewportGap,
+                },
+            }, viewportRef: viewportRef, children: isGated ? null : children }) }));
+}
+// Captures the scrollable viewport element so the imperative handle can expose
+// it.
+function PDFViewerViewportBridge({ viewportElementRef, }) {
+    const elementRef = useViewportElement();
+    React.useEffect(() => {
+        viewportElementRef.current = elementRef?.current ?? null;
+    });
+    return null;
+}
+function PDFViewerTextSelectionLayer({ documentId, pageIndex, scale, }) {
+    const { plugin: selectionPlugin } = useSelectionPlugin();
+    const [rects, setRects] = React.useState([]);
+    React.useEffect(() => {
+        if (!selectionPlugin)
+            return;
+        return selectionPlugin.registerSelectionOnPage({
+            documentId,
+            pageIndex,
+            onRectsChange: ({ rects: nextRects }) => {
+                setRects(nextRects);
+            },
+        });
+    }, [documentId, pageIndex, selectionPlugin]);
+    if (!rects.length)
+        return null;
+    return (_jsx(_Fragment, { children: rects.map((rect, index) => (_jsx("div", { className: "pointer-events-none absolute", style: {
+                background: TEXT_SELECTION_BACKGROUND,
+                height: rect.size.height * scale,
+                left: rect.origin.x * scale,
+                top: rect.origin.y * scale,
+                width: rect.size.width * scale,
+            } }, `${index}-${rect.origin.x}-${rect.origin.y}`))) }));
+}
+function PDFViewerSelectionReleaseGuard({ documentId }) {
+    const { plugin: selectionPlugin } = useSelectionPlugin();
+    const { provides: selection } = useSelectionCapability();
+    const lastSelectionModeIdRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!selection)
+            return;
+        return selection.forDocument(documentId).onBeginSelection(({ modeId }) => {
+            lastSelectionModeIdRef.current = modeId;
+        });
+    }, [documentId, selection]);
+    React.useEffect(() => {
+        if (!selection)
+            return;
+        let cleanupFrame = 0;
+        const finalizeIfStillSelecting = () => {
+            window.cancelAnimationFrame(cleanupFrame);
+            cleanupFrame = window.requestAnimationFrame(() => {
+                const selectionState = selection.getState(documentId);
+                if (!selectionState.selecting)
+                    return;
+                if (selectionState.selection && selectionPlugin) {
+                    const pluginWithEndSelection = selectionPlugin;
+                    pluginWithEndSelection.endSelection?.(documentId, lastSelectionModeIdRef.current ?? 'pointerMode');
+                    return;
+                }
+                if (!selectionState.selection) {
+                    selection.clear(documentId);
+                }
+            });
+        };
+        window.addEventListener('pointerup', finalizeIfStillSelecting);
+        window.addEventListener('pointercancel', finalizeIfStillSelecting);
+        window.addEventListener('blur', finalizeIfStillSelecting);
+        return () => {
+            window.cancelAnimationFrame(cleanupFrame);
+            window.removeEventListener('pointerup', finalizeIfStillSelecting);
+            window.removeEventListener('pointercancel', finalizeIfStillSelecting);
+            window.removeEventListener('blur', finalizeIfStillSelecting);
+        };
+    }, [documentId, selection, selectionPlugin]);
+    return null;
+}
+function isEditableCopyTarget(target) {
+    if (!(target instanceof HTMLElement))
+        return false;
+    if (target.isContentEditable)
+        return true;
+    return Boolean(target.closest("input, textarea, [contenteditable='true']"));
+}
+/**
+ * True when a keydown is the copy shortcut for the PDF selection.
+ *
+ * `KeyboardEvent.key` is typed `string`, but Safari can deliver a `keydown`
+ * whose `key` is `undefined`. This listener is on `document`, so it sees every
+ * keystroke on the page — the unguarded `event.key.toLowerCase()` threw a
+ * `TypeError` on those events. A copy shortcut needs a real key, so a missing
+ * key is never the shortcut.
+ */
+export function isPdfCopyShortcut(event) {
+    if (typeof event.key !== 'string' || event.key.toLowerCase() !== 'c')
+        return false;
+    return event.metaKey || event.ctrlKey;
+}
+function PDFViewerSelectionCopyShortcut({ documentId }) {
+    const { provides: selection } = useSelectionCapability();
+    React.useEffect(() => {
+        if (!selection)
+            return;
+        const copySelectedPdfText = (event) => {
+            if (isEditableCopyTarget(event.target))
+                return;
+            if (!selection.getState(documentId).selection)
+                return;
+            event.preventDefault();
+            selection.copyToClipboard(documentId);
+        };
+        const handleKeyDown = (event) => {
+            if (!isPdfCopyShortcut(event))
+                return;
+            copySelectedPdfText(event);
+        };
+        document.addEventListener('copy', copySelectedPdfText);
+        document.addEventListener('keydown', handleKeyDown);
+        return () => {
+            document.removeEventListener('copy', copySelectedPdfText);
+            document.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [documentId, selection]);
+    return null;
+}
+function isQuarterTurn(rotation) {
+    return rotation % 2 === 1;
+}
+function getRotatedDimensions({ height, rotation, width, }) {
+    return isQuarterTurn(rotation) ? { height: width, width: height } : { height, width };
+}
+function getRotatedPageDimensions(page, rotation) {
+    return getRotatedDimensions({
+        height: page.height,
+        rotation,
+        width: page.width,
+    });
+}
+function applyPageRotationDeltasToScrollerLayout({ basePageRotations, layout, pageRotationDeltas, }) {
+    if (pageRotationDeltas.size === 0)
+        return layout;
+    let maxWidth = 0;
+    let maxHeight = 0;
+    let offset = 0;
+    const pageGap = layout.pageGap;
+    let startSpacingAdjustment = 0;
+    const items = layout.items.map((item, itemIndex) => {
+        let pageOffset = 0;
+        let itemWidth = 0;
+        let itemHeight = 0;
+        const pageLayouts = item.pageLayouts.map((page) => {
+            const basePageRotation = basePageRotations[page.pageIndex] ?? normalizeRotation(0);
+            const pageRotation = normalizeRotation(basePageRotation + (pageRotationDeltas.get(page.pageIndex) ?? 0));
+            const rotatedSize = getRotatedPageDimensions(page, pageRotation);
+            const oldScrollAxisSize = layout.strategy === ScrollStrategy.Horizontal ? page.rotatedWidth : page.rotatedHeight;
+            const newScrollAxisSize = layout.strategy === ScrollStrategy.Horizontal ? rotatedSize.width : rotatedSize.height;
+            if (layout.startSpacing === 0 &&
+                itemIndex === 0 &&
+                pageOffset === 0 &&
+                newScrollAxisSize < oldScrollAxisSize) {
+                startSpacingAdjustment = Math.max(startSpacingAdjustment, (oldScrollAxisSize - newScrollAxisSize) / 2);
+            }
+            const nextPageLayout = {
+                ...page,
+                rotatedHeight: rotatedSize.height,
+                rotatedWidth: rotatedSize.width,
+                x: layout.strategy === ScrollStrategy.Horizontal ? 0 : pageOffset,
+                y: layout.strategy === ScrollStrategy.Horizontal ? pageOffset : 0,
+            };
+            pageOffset +=
+                (layout.strategy === ScrollStrategy.Horizontal ? rotatedSize.height : rotatedSize.width) +
+                    pageGap;
+            itemWidth =
+                layout.strategy === ScrollStrategy.Horizontal
+                    ? Math.max(itemWidth, rotatedSize.width)
+                    : itemWidth + rotatedSize.width;
+            itemHeight =
+                layout.strategy === ScrollStrategy.Horizontal
+                    ? itemHeight + rotatedSize.height
+                    : Math.max(itemHeight, rotatedSize.height);
+            return nextPageLayout;
+        });
+        if (pageLayouts.length > 1) {
+            if (layout.strategy === ScrollStrategy.Horizontal) {
+                itemHeight -= pageGap;
+            }
+            else {
+                itemWidth -= pageGap;
+            }
+        }
+        const nextItem = {
+            ...item,
+            height: itemHeight,
+            offset,
+            pageLayouts,
+            width: itemWidth,
+            x: layout.strategy === ScrollStrategy.Horizontal ? offset : item.x,
+            y: layout.strategy === ScrollStrategy.Horizontal ? item.y : offset,
+        };
+        if (layout.strategy === ScrollStrategy.Horizontal) {
+            offset += itemWidth + pageGap;
+            maxHeight = Math.max(maxHeight, itemHeight);
+        }
+        else {
+            offset += itemHeight + pageGap;
+            maxWidth = Math.max(maxWidth, itemWidth);
+        }
+        return nextItem;
+    });
+    if (items.length > 0) {
+        offset -= pageGap;
+    }
+    return {
+        ...layout,
+        endSpacing: layout.endSpacing,
+        items,
+        startSpacing: layout.startSpacing + startSpacingAdjustment,
+        totalHeight: layout.strategy === ScrollStrategy.Horizontal
+            ? maxHeight
+            : layout.startSpacing + startSpacingAdjustment + offset + layout.endSpacing,
+        totalWidth: layout.strategy === ScrollStrategy.Horizontal
+            ? layout.startSpacing + startSpacingAdjustment + offset + layout.endSpacing
+            : maxWidth,
+    };
+}
+function PDFViewerScroller({ documentId, pageRotationDeltas, basePageRotations, renderPage, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const { plugin: scrollPlugin } = useScrollPlugin();
+    const [layoutData, setLayoutData] = React.useState({ docId: null, layout: null });
+    React.useEffect(() => {
+        if (!scrollPlugin || !documentId)
+            return;
+        let frame = 0;
+        const setCurrentLayout = () => {
+            try {
+                setLayoutData({
+                    docId: documentId,
+                    layout: scrollPlugin.getScrollerLayout(documentId),
+                });
+            }
+            catch {
+                setLayoutData({ docId: documentId, layout: null });
+            }
+        };
+        const unsubscribe = scrollPlugin.onScrollerData(documentId, (layout) => {
+            setLayoutData({ docId: documentId, layout });
+        });
+        frame = window.requestAnimationFrame(setCurrentLayout);
+        return () => {
+            window.cancelAnimationFrame(frame);
+            unsubscribe();
+            setLayoutData({ docId: null, layout: null });
+            scrollPlugin.clearLayoutReady(documentId);
+        };
+    }, [documentId, scrollPlugin]);
+    const scrollerLayout = React.useMemo(() => {
+        if (layoutData.docId !== documentId || !layoutData.layout)
+            return null;
+        return applyPageRotationDeltasToScrollerLayout({
+            basePageRotations,
+            layout: layoutData.layout,
+            pageRotationDeltas,
+        });
+    }, [basePageRotations, documentId, layoutData, pageRotationDeltas]);
+    React.useLayoutEffect(() => {
+        if (!scrollPlugin || !documentId || !scrollerLayout)
+            return;
+        scrollPlugin.setLayoutReady(documentId);
+    }, [documentId, scrollPlugin, scrollerLayout]);
+    if (!scrollerLayout)
+        return null;
+    return (_jsxs("div", { style: {
+            width: `${scrollerLayout.totalWidth}px`,
+            height: `${scrollerLayout.totalHeight}px`,
+            position: 'relative',
+            boxSizing: 'border-box',
+            margin: "0 auto",
+            ...(scrollerLayout.strategy === ScrollStrategy.Horizontal && {
+                display: 'flex',
+                flexDirection: 'row',
+            }),
+        }, children: [_jsx("div", { style: scrollerLayout.strategy === ScrollStrategy.Horizontal
+                    ? {
+                        width: scrollerLayout.startSpacing,
+                        height: '100%',
+                        flexShrink: 0,
+                    }
+                    : {
+                        height: scrollerLayout.startSpacing,
+                        width: '100%',
+                    } }), _jsx("div", { style: {
+                    gap: scrollerLayout.pageGap,
+                    display: 'flex',
+                    alignItems: 'center',
+                    position: 'relative',
+                    boxSizing: 'border-box',
+                    ...(scrollerLayout.strategy === ScrollStrategy.Horizontal
+                        ? {
+                            flexDirection: 'row',
+                            minHeight: '100%',
+                        }
+                        : {
+                            flexDirection: 'column',
+                            minWidth: 'fit-content',
+                        }),
+                }, children: scrollerLayout.items.map((item) => (_jsx("div", { style: {
+                        display: 'flex',
+                        justifyContent: 'center',
+                        gap: scrollerLayout.pageGap,
+                    }, children: item.pageLayouts.map((layout) => (_jsx("div", { style: {
+                            width: `${layout.rotatedWidth}px`,
+                            height: `${layout.rotatedHeight}px`,
+                            position: 'relative',
+                            zIndex: layout.elevated ? 1 : undefined,
+                        }, children: renderPage(layout) }, layout.pageNumber))) }, item.pageNumbers[0]))) }), _jsx("div", { style: scrollerLayout.strategy === ScrollStrategy.Horizontal
+                    ? {
+                        width: scrollerLayout.endSpacing,
+                        height: '100%',
+                        flexShrink: 0,
+                    }
+                    : {
+                        height: scrollerLayout.endSpacing,
+                        width: '100%',
+                    } })] }));
+}
+function PDFViewerInner({ viewerRef, pdfFile, documentId, document: pdfDocument, defaultZoom, className, fileName, showDownload, showToolbar, showRotateControls, showUpload, toolbarActions, pageClassName, renderPageOverlay, onActivePageChange, onPdfUpload, onPagePointerDown, onPagePointerMove, onPagePointerUp, onPagePointerCancel, onUploadFile, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const { registry } = useRegistry();
+    const { state: scrollState, provides: scroll } = useScroll(documentId);
+    const { state: zoomState, provides: zoom } = useZoom(documentId);
+    const { provides: viewportCapability } = useViewportCapability();
+    const { provides: thumbnails } = useThumbnailCapability();
+    const { plugin: thumbnailPlugin } = useThumbnailPlugin();
+    const [sidebarOpen, setSidebarOpen] = React.useState(false);
+    const [isPreparingDownload, setIsPreparingDownload] = React.useState(false);
+    const [pageRotationDeltas, setPageRotationDeltas] = React.useState(() => new Map());
+    const [selectedPageIndexes, setSelectedPageIndexes] = React.useState(() => new Set());
+    const basePageRotations = React.useMemo(() => pdfDocument?.pages.map((page) => normalizeRotation(page.rotation)) ?? [], [pdfDocument]);
+    const [viewerShellRef, viewerShellWidth] = useElementWidth();
+    const sidebarInline = useInlineThumbnailSidebar(viewerShellWidth);
+    const viewportElementRef = React.useRef(null);
+    const pageRotationDeltasRef = React.useRef(pageRotationDeltas);
+    const selectedPageIndexesRef = React.useRef(selectedPageIndexes);
+    const selectionAnchorPageIndexRef = React.useRef(null);
+    const suppressActivePageSelectionSyncRef = React.useRef(null);
+    const initializedSelectionDocumentRef = React.useRef(null);
+    const activePage = scrollState.currentPage;
+    const numPages = pdfDocument?.pageCount ?? 0;
+    const isLoading = !pdfDocument;
+    const controlsDisabled = !numPages;
+    const thumbnailSidebarVisible = sidebarOpen && !isLoading;
+    const currentZoomLevel = zoomState.currentZoomLevel;
+    const alignedThumbnailSidebarDocumentRef = React.useRef(null);
+    React.useEffect(() => {
+        pageRotationDeltasRef.current = pageRotationDeltas;
+    }, [pageRotationDeltas]);
+    React.useEffect(() => {
+        selectedPageIndexesRef.current = selectedPageIndexes;
+    }, [selectedPageIndexes]);
+    React.useEffect(() => {
+        if (activePage > 0)
+            onActivePageChange?.(activePage);
+    }, [activePage, onActivePageChange]);
+    React.useEffect(() => {
+        if (activePage < 1 || numPages < 1)
+            return;
+        const activePageIndex = activePage - 1;
+        const suppressedPageIndex = suppressActivePageSelectionSyncRef.current;
+        suppressActivePageSelectionSyncRef.current = null;
+        if (suppressedPageIndex === activePageIndex)
+            return;
+        const nextSelection = new Set([activePageIndex]);
+        selectionAnchorPageIndexRef.current = activePageIndex;
+        selectedPageIndexesRef.current = nextSelection;
+        setSelectedPageIndexes((previousSelection) => arePageIndexSetsEqual(previousSelection, nextSelection) ? previousSelection : nextSelection);
+    }, [activePage, numPages]);
+    React.useEffect(() => {
+        if (numPages < 1 || initializedSelectionDocumentRef.current === documentId) {
+            return;
+        }
+        const initialPageIndex = Math.max(0, (activePage > 0 ? activePage : 1) - 1);
+        const initialSelection = new Set([initialPageIndex]);
+        initializedSelectionDocumentRef.current = documentId;
+        selectionAnchorPageIndexRef.current = initialPageIndex;
+        selectedPageIndexesRef.current = initialSelection;
+        setSelectedPageIndexes(initialSelection);
+    }, [activePage, documentId, numPages]);
+    React.useEffect(() => {
+        if (!thumbnailSidebarVisible) {
+            alignedThumbnailSidebarDocumentRef.current = null;
+            return;
+        }
+        if (activePage < 1 ||
+            !thumbnails ||
+            alignedThumbnailSidebarDocumentRef.current === documentId) {
+            return;
+        }
+        alignedThumbnailSidebarDocumentRef.current = documentId;
+        const frame = window.requestAnimationFrame(() => {
+            thumbnails.forDocument(documentId).scrollToThumb(activePage - 1);
+        });
+        return () => window.cancelAnimationFrame(frame);
+    }, [activePage, documentId, thumbnailSidebarVisible, thumbnails]);
+    // The zoom plugin only releases its viewport gate for mode-based zoom levels
+    // (automatic/fit); with a numeric default the gate would never lift on its
+    // own, so apply the initial zoom explicitly once the document loads.
+    //
+    // If the viewport is zero-sized at that moment — e.g. the card mounts
+    // collapsed / `display:none` and only expands later (a streaming tool card) —
+    // the zoom request bails on the plugin's zero-metrics guard *without*
+    // releasing the gate, and for a numeric zoom nothing ever retries, leaving the
+    // page area blank while the toolbar still reports the page count. Re-request
+    // the zoom when the viewport later reports a non-zero size, guarded by
+    // `isGated` so an ordinary resize never clobbers a user's chosen zoom.
+    const initialZoomDocumentRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!pdfDocument || !zoom || !viewportCapability)
+            return;
+        if (initialZoomDocumentRef.current !== documentId) {
+            initialZoomDocumentRef.current = documentId;
+            zoom.requestZoom(defaultZoom);
+        }
+        if (!viewportCapability.isGated(documentId))
+            return;
+        return viewportCapability.onViewportResize((event) => {
+            if (event.documentId !== documentId)
+                return;
+            const { clientWidth, clientHeight } = event.metrics;
+            if (clientWidth > 0 && clientHeight > 0 && viewportCapability.isGated(documentId)) {
+                zoom.requestZoom(defaultZoom);
+            }
+        });
+    }, [defaultZoom, documentId, pdfDocument, zoom, viewportCapability]);
+    const scrollToPage = React.useCallback((pageNumber, options) => {
+        scroll?.scrollToPage({
+            pageNumber,
+            behavior: options?.behavior === 'smooth' ? 'smooth' : 'auto',
+        });
+    }, [scroll]);
+    const selectThumbnailPage = React.useCallback((pageNumber, mode) => {
+        const pageIndex = pageNumber - 1;
+        if (pageIndex < 0 || pageIndex >= numPages)
+            return;
+        suppressActivePageSelectionSyncRef.current = pageIndex;
+        const previousSelection = selectedPageIndexesRef.current;
+        let nextSelection;
+        if (mode === 'range') {
+            const anchorPageIndex = selectionAnchorPageIndexRef.current ?? (activePage > 0 ? activePage - 1 : pageIndex);
+            nextSelection = getPageIndexRange(anchorPageIndex, pageIndex);
+        }
+        else if (mode === 'toggle') {
+            nextSelection = new Set(previousSelection);
+            if (nextSelection.has(pageIndex)) {
+                nextSelection.delete(pageIndex);
+            }
+            else {
+                nextSelection.add(pageIndex);
+            }
+            selectionAnchorPageIndexRef.current = pageIndex;
+        }
+        else {
+            nextSelection = new Set([pageIndex]);
+            selectionAnchorPageIndexRef.current = pageIndex;
+        }
+        selectedPageIndexesRef.current = nextSelection;
+        setSelectedPageIndexes(nextSelection);
+        scrollToPage(pageNumber);
+    }, [activePage, numPages, scrollToPage]);
+    React.useImperativeHandle(viewerRef, () => ({
+        scrollToPage,
+        scrollToPageArea: (pageNumber, area, options) => {
+            const pageSize = pdfDocument?.pages[pageNumber - 1]?.size;
+            scroll?.scrollToPage({
+                pageNumber,
+                ...(pageSize
+                    ? {
+                        pageCoordinates: {
+                            x: ((area.left ?? 0) / 100) * pageSize.width,
+                            y: (area.top / 100) * pageSize.height,
+                        },
+                        alignY: 25,
+                    }
+                    : {}),
+                behavior: options?.behavior === 'smooth' ? 'smooth' : 'auto',
+            });
+        },
+        getViewportElement: () => viewportElementRef.current,
+    }), [pdfDocument, scroll, scrollToPage]);
+    const handleDownload = React.useCallback(async () => {
+        if (!pdfFile || isPreparingDownload)
+            return;
+        setIsPreparingDownload(true);
+        try {
+            await downloadPdfWithPageRotations({
+                fileName: getPdfDownloadFileName(fileName, pdfFile),
+                pageRotationDeltas,
+                src: pdfFile,
+            });
+        }
+        catch (error) {
+            console.error(error);
+        }
+        finally {
+            setIsPreparingDownload(false);
+        }
+    }, [fileName, isPreparingDownload, pageRotationDeltas, pdfFile]);
+    const rotateSelectedPages = React.useCallback((direction) => {
+        if (!pdfDocument || !registry || activePage < 1)
+            return;
+        const documentState = registry.getStore().getState().core.documents[documentId];
+        const currentDocument = documentState?.document ?? pdfDocument;
+        const selectedTargetPageIndexes = Array.from(selectedPageIndexesRef.current).filter((pageIndex) => currentDocument.pages[pageIndex]);
+        const fallbackPageIndex = activePage - 1;
+        const targetPageIndexes = (selectedTargetPageIndexes.length ? selectedTargetPageIndexes : [fallbackPageIndex])
+            .filter((pageIndex) => currentDocument.pages[pageIndex])
+            .sort((a, b) => a - b);
+        if (targetPageIndexes.length === 0)
+            return;
+        const previousDeltas = pageRotationDeltasRef.current;
+        const nextDeltas = new Map(previousDeltas);
+        const referencePageIndex = activePage > 0 && currentDocument.pages[activePage - 1]
+            ? activePage - 1
+            : targetPageIndexes[0];
+        let scrollDelta = 0;
+        for (const pageIndex of targetPageIndexes) {
+            const currentPage = currentDocument.pages[pageIndex];
+            if (!currentPage)
+                continue;
+            const previousDelta = previousDeltas.get(pageIndex) ?? 0;
+            const nextDelta = normalizeRotation(previousDelta + direction);
+            const basePageRotation = basePageRotations[pageIndex] ?? normalizeRotation(currentPage.rotation);
+            const previousPageRotation = normalizeRotation(basePageRotation + previousDelta);
+            const nextPageRotation = normalizeRotation(basePageRotation + nextDelta);
+            const previousRotatedSize = getRotatedDimensions({
+                height: currentPage.size.height * currentZoomLevel,
+                rotation: previousPageRotation,
+                width: currentPage.size.width * currentZoomLevel,
+            });
+            const nextRotatedSize = getRotatedDimensions({
+                height: currentPage.size.height * currentZoomLevel,
+                rotation: nextPageRotation,
+                width: currentPage.size.width * currentZoomLevel,
+            });
+            const heightDelta = nextRotatedSize.height - previousRotatedSize.height;
+            if (pageIndex < referencePageIndex) {
+                scrollDelta += heightDelta;
+            }
+            else if (pageIndex === referencePageIndex) {
+                scrollDelta += heightDelta / 2;
+            }
+            if (nextDelta) {
+                nextDeltas.set(pageIndex, nextDelta);
+            }
+            else {
+                nextDeltas.delete(pageIndex);
+            }
+        }
+        const store = registry.getStore();
+        const viewport = viewportElementRef.current;
+        pageRotationDeltasRef.current = nextDeltas;
+        flushSync(() => {
+            setPageRotationDeltas(nextDeltas);
+            store.dispatchToCore(refreshPages(documentId, targetPageIndexes));
+        });
+        if (viewport && scrollDelta !== 0) {
+            viewport.scrollTop += scrollDelta;
+        }
+        thumbnailPlugin?.calculateWindowState?.(documentId);
+    }, [
+        activePage,
+        basePageRotations,
+        currentZoomLevel,
+        documentId,
+        pdfDocument,
+        registry,
+        thumbnailPlugin,
+    ]);
+    const handleUpload = React.useCallback((file) => {
+        onUploadFile(file);
+        onPdfUpload?.(file);
+    }, [onPdfUpload, onUploadFile]);
+    const renderPage = React.useCallback((page) => {
+        const pageNumber = page.pageNumber;
+        const basePageRotation = basePageRotations[page.pageIndex] ??
+            pdfDocument?.pages[page.pageIndex]?.rotation ??
+            normalizeRotation(0);
+        const pageRotation = normalizeRotation(basePageRotation + (pageRotationDeltas.get(page.pageIndex) ?? 0));
+        return (_jsx(Rotate, { documentId: documentId, pageIndex: page.pageIndex, rotation: pageRotation, children: _jsxs(PagePointerProvider, { documentId: documentId, pageIndex: page.pageIndex, rotation: pageRotation, "data-pdf-viewer-page": pageNumber, className: cn('relative border border-transparent bg-transparent shadow-xs select-none selection:bg-transparent selection:text-inherit', pageClassName?.(pageNumber)), style: { backgroundColor: 'transparent' }, onPointerDown: (event) => onPagePointerDown?.(event, pageNumber), onPointerMove: (event) => onPagePointerMove?.(event, pageNumber), onPointerUp: (event) => onPagePointerUp?.(event, pageNumber), onPointerCancel: (event) => onPagePointerCancel?.(event, pageNumber), children: [_jsx("div", { "aria-hidden": "true", className: "pointer-events-none absolute inset-0 bg-white" }), _jsx(RenderLayer, { documentId: documentId, pageIndex: page.pageIndex, scale: Math.min(currentZoomLevel, PAGE_BASE_RENDER_MAX_SCALE), dpr: PAGE_BASE_RENDER_DPR, className: "pointer-events-none absolute inset-0 h-full w-full object-fill opacity-100 blur-[0.35px] transition-none" }), _jsx(TilingLayer, { documentId: documentId, pageIndex: page.pageIndex, className: "pointer-events-none opacity-100 transition-none [&_img]:opacity-100 [&_img]:transition-none" }, `tiles-${page.pageIndex}-${pageRotation}`), _jsx(SearchLayer, { documentId: documentId, pageIndex: page.pageIndex, className: "pointer-events-none", highlightColor: "color-mix(in srgb, var(--kortix-yellow) 45%, transparent)", activeHighlightColor: "color-mix(in srgb, var(--kortix-orange) 55%, transparent)" }), _jsx(PDFViewerTextSelectionLayer, { documentId: documentId, pageIndex: page.pageIndex, scale: currentZoomLevel }), renderPageOverlay?.({
+                        pageNumber,
+                        pageWidth: page.width,
+                        pageHeight: page.height,
+                        scale: currentZoomLevel,
+                        rotation: rotationToDegrees(pageRotation),
+                    })] }, `${page.pageIndex}-${pageRotation}`) }));
+    }, [
+        basePageRotations,
+        currentZoomLevel,
+        onPagePointerCancel,
+        onPagePointerDown,
+        onPagePointerMove,
+        onPagePointerUp,
+        pageClassName,
+        pageRotationDeltas,
+        renderPageOverlay,
+        documentId,
+        pdfDocument,
+    ]);
+    return (_jsxs("div", { "data-slot": "pdf-viewer", className: cn('bg-background flex h-full max-h-full min-h-0 w-full flex-col overflow-hidden', className), children: [showToolbar ? (_jsxs("div", { className: "bg-background flex min-h-12 flex-wrap items-center justify-between gap-2 border-b px-3 py-2", children: [_jsxs("div", { className: "flex min-w-0 flex-wrap items-center gap-2", children: [_jsx(TooltipProvider, { children: _jsx(ToolbarTooltip, { label: tI18nComplete.raw('text3bba69274a7d'), children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('text3bba69274a7d'), disabled: controlsDisabled, onClick: () => setSidebarOpen((open) => !open), children: _jsx(PanelLeft, { className: "size-4" }) }) }) }), _jsx(PDFViewerPageNumberControl, { activePage: activePage, controlsDisabled: controlsDisabled, numPages: numPages, onPageChange: scrollToPage })] }), _jsx(TooltipProvider, { children: _jsxs("div", { className: "flex min-w-0 flex-wrap items-center justify-end gap-1", children: [showRotateControls ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-none items-center gap-1", children: [_jsx(ToolbarTooltip, { label: tI18nComplete.raw('text10fdf5583470'), children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('text10fdf5583470'), disabled: controlsDisabled, onClick: () => rotateSelectedPages(-1), children: _jsx(RotateCw, { className: "size-4" }) }) }), _jsx(ToolbarTooltip, { label: tI18nComplete.raw('textfb594c58c73d'), children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('textfb594c58c73d'), disabled: controlsDisabled, onClick: () => rotateSelectedPages(1), children: _jsx(RotateCw, { className: "size-4 -scale-x-100" }) }) })] }), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-4 self-center" })] })) : null, _jsxs("div", { className: "flex flex-none items-center gap-1", children: [_jsx(ToolbarTooltip, { label: tI18nComplete.raw('textbc7b631a689b'), children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('textbc7b631a689b'), disabled: controlsDisabled || currentZoomLevel <= ZOOM_OPTIONS[0], onClick: () => {
+                                                    const nextZoom = [...ZOOM_OPTIONS]
+                                                        .reverse()
+                                                        .find((option) => option < currentZoomLevel);
+                                                    zoom?.requestZoom(nextZoom ?? ZOOM_OPTIONS[0]);
+                                                }, children: _jsx(CircleMinus, { className: "size-4" }) }) }), _jsxs(Select, { value: String(currentZoomLevel), onValueChange: (value) => zoom?.requestZoom(Number(value)), disabled: controlsDisabled, modal: false, children: [_jsx(SelectTrigger, { size: "sm", className: "w-[84px] min-w-[84px] tabular-nums", children: _jsxs(SelectValue, { placeholder: tI18nComplete.raw('text509c517ede79'), children: [Math.round(currentZoomLevel * 100), "%"] }) }), _jsx(SelectContent, { alignItemWithTrigger: false, children: ZOOM_OPTIONS.map((option) => (_jsxs(SelectItem, { value: String(option), children: [Math.round(option * 100), "%"] }, option))) })] }), _jsx(ToolbarTooltip, { label: tI18nComplete.raw('text0e47f09a748f'), children: _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", className: "transition-transform active:scale-[0.96]", "aria-label": tI18nComplete.raw('text0e47f09a748f'), disabled: controlsDisabled || currentZoomLevel >= ZOOM_OPTIONS[ZOOM_OPTIONS.length - 1], onClick: () => {
+                                                    const nextZoom = ZOOM_OPTIONS.find((option) => option > currentZoomLevel);
+                                                    zoom?.requestZoom(nextZoom ?? ZOOM_OPTIONS[ZOOM_OPTIONS.length - 1]);
+                                                }, children: _jsx(CirclePlus, { className: "size-4" }) }) })] }), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-4 self-center" }), _jsx(PDFViewerSearchControl, { documentId: documentId, controlsDisabled: controlsDisabled }, documentId), toolbarActions ? (_jsxs(_Fragment, { children: [_jsx(Separator, { orientation: "vertical", className: "mx-1 h-4 self-center" }), toolbarActions] })) : null, showDownload || showUpload ? (_jsxs(_Fragment, { children: [_jsx(Separator, { orientation: "vertical", className: "mx-1 h-4 self-center" }), _jsx(PDFViewerFileActionsMenu, { onUploadFile: handleUpload, showUpload: showUpload }), showDownload ? (_jsx(ViewerDownloadButton, { disabled: controlsDisabled, pending: isPreparingDownload, onDownload: () => void handleDownload() })) : null] })) : null] }) })] })) : null, _jsxs("div", { ref: viewerShellRef, className: "bg-muted/30 relative flex min-h-0 flex-1 overflow-hidden", children: [isLoading ? (_jsx(PDFViewerLoadingSkeleton, { sidebarInline: sidebarInline, sidebarOpen: sidebarOpen })) : null, _jsxs("div", { className: "flex h-full max-h-full min-h-0 w-full flex-1 overflow-hidden", children: [_jsx(DocumentViewerThumbnailSidebar, { closedInlineClassName: THUMBNAIL_SIDEBAR_CLOSED_CLASS, inline: sidebarInline, open: thumbnailSidebarVisible, widthClassName: THUMBNAIL_SIDEBAR_WIDTH_CLASS, children: thumbnailSidebarVisible ? (_jsx(PDFViewerThumbnails, { basePageRotations: basePageRotations, documentId: documentId, activePage: activePage, pageCount: numPages, pageRotationDeltas: pageRotationDeltas, pdfDocument: pdfDocument, selectedPageIndexes: selectedPageIndexes, onSelectPage: selectThumbnailPage })) : null }), _jsxs(PDFViewerScrollAreaViewport, { documentId: documentId, className: "relative h-full max-h-full min-h-0 min-w-0 flex-1", children: [_jsx(PDFViewerViewportBridge, { viewportElementRef: viewportElementRef }), _jsx(PDFViewerSelectionCopyShortcut, { documentId: documentId }), _jsx(PDFViewerSelectionReleaseGuard, { documentId: documentId }), _jsx(GlobalPointerProvider, { documentId: documentId, children: _jsx(PDFViewerScroller, { basePageRotations: basePageRotations, documentId: documentId, pageRotationDeltas: pageRotationDeltas, renderPage: renderPage }) }), _jsx(CopyToClipboard, {})] })] })] })] }));
+}
+function PDFViewerDocumentLoader({ pdfFile, onDocumentLoadSuccess, ...innerProps }) {
+    const { provides: documentManager } = useDocumentManagerCapability();
+    const { activeDocumentId, activeDocument } = useActiveDocument();
+    const [loadError, setLoadError] = React.useState(false);
+    const openedFileRef = React.useRef(null);
+    const onDocumentLoadSuccessRef = React.useRef(onDocumentLoadSuccess);
+    // `null` outside a <PreviewFitProvider> — see image-renderer.tsx for why
+    // `report` below is then an inert no-op everywhere but the Easy panel.
+    const previewFit = usePreviewFit();
+    const reportedDocumentIdRef = React.useRef(null);
+    React.useEffect(() => {
+        onDocumentLoadSuccessRef.current = onDocumentLoadSuccess;
+    });
+    React.useEffect(() => {
+        if (!documentManager || !pdfFile)
+            return;
+        if (openedFileRef.current === pdfFile)
+            return;
+        openedFileRef.current = pdfFile;
+        setLoadError(false);
+        const previousDocumentIds = documentManager
+            .getOpenDocuments()
+            .map((openDocument) => openDocument.id);
+        const handleOpenError = () => {
+            if (openedFileRef.current === pdfFile)
+                setLoadError(true);
+        };
+        documentManager
+            .openDocumentUrl({
+            url: pdfFile,
+            mode: pdfFile.startsWith('blob:') ? 'full-fetch' : 'auto',
+        })
+            .wait((response) => {
+            response.task.wait((openedDocument) => {
+                onDocumentLoadSuccessRef.current?.(openedDocument.pageCount);
+                previousDocumentIds.forEach((documentIdToClose) => {
+                    documentManager.closeDocument(documentIdToClose).wait(() => undefined, () => undefined);
+                });
+            }, handleOpenError);
+        }, handleOpenError);
+    }, [documentManager, pdfFile]);
+    const document = activeDocument?.status === 'loaded' ? activeDocument.document : null;
+    const documentFailed = loadError || activeDocument?.status === 'error';
+    // Report page 1's intrinsic size once per loaded document — guarded on
+    // `activeDocumentId` so a re-render (zoom, scroll, rotation) never
+    // re-reports the same document.
+    React.useEffect(() => {
+        if (!previewFit || !activeDocumentId || !document)
+            return;
+        if (reportedDocumentIdRef.current === activeDocumentId)
+            return;
+        const firstPage = document.pages[0];
+        if (!firstPage)
+            return;
+        reportedDocumentIdRef.current = activeDocumentId;
+        previewFit.report(getRotatedPageSize(firstPage.size, firstPage.rotation));
+    }, [previewFit, activeDocumentId, document]);
+    // A PDF that fetched fine and will not parse renders the fallback shell
+    // below and never reaches the report above. Saying so explicitly is what
+    // stops a consumer sizing itself to whatever it measured last — silence
+    // here would read as "still loading", which this is not.
+    React.useEffect(() => {
+        if (!previewFit || !documentFailed)
+            return;
+        previewFit.reportUnmeasurable();
+    }, [previewFit, documentFailed]);
+    if (!activeDocumentId || documentFailed || !pdfFile) {
+        return (_jsx(PDFViewerFallbackShell, { className: innerProps.className, showToolbar: innerProps.showToolbar, showUpload: innerProps.showUpload, sidebarOpen: false, state: !pdfFile ? 'empty' : documentFailed ? 'error' : 'loading', onUploadFile: (file) => {
+                innerProps.onUploadFile(file);
+                innerProps.onPdfUpload?.(file);
+            } }));
+    }
+    return (_jsx(PDFViewerInner, { ...innerProps, pdfFile: pdfFile, documentId: activeDocumentId, document: document }, activeDocumentId));
+}
+export const PDFViewer = React.forwardRef(function PDFViewer({ className, defaultZoom = DEFAULT_ZOOM, fitOnOpen, fileName, showDownload = true, showRotateControls = true, showToolbar = true, showUpload = true, src, toolbarActions, pageClassName, renderPageOverlay, onActivePageChange, onDocumentLoadSuccess, onPdfUpload, onPagePointerDown, onPagePointerMove, onPagePointerUp, onPagePointerCancel, }, ref) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const { engine, error: engineError } = useSharedPdfEngine();
+    const [uploadedPdfFile, setUploadedPdfFile] = React.useState(() => ({ src, url: null }));
+    const uploadedPdfUrl = uploadedPdfFile.src === src ? uploadedPdfFile.url : null;
+    const pdfFile = uploadedPdfUrl ?? src ?? '';
+    React.useEffect(() => () => {
+        if (uploadedPdfUrl)
+            URL.revokeObjectURL(uploadedPdfUrl);
+    }, [uploadedPdfUrl]);
+    const handleUploadFile = React.useCallback((nextFile) => {
+        const nextUrl = URL.createObjectURL(nextFile);
+        setUploadedPdfFile({ src, url: nextUrl });
+    }, [src]);
+    // Plugin registrations are created once per viewer instance.
+    const [plugins] = React.useState(() => [
+        createPluginRegistration(DocumentManagerPluginPackage),
+        createPluginRegistration(ViewportPluginPackage, {
+            viewportGap: PAGE_GAP,
+        }),
+        createPluginRegistration(ScrollPluginPackage, {
+            defaultPageGap: PAGE_GAP,
+            defaultBufferSize: 2,
+        }),
+        createPluginRegistration(RenderPluginPackage),
+        createPluginRegistration(TilingPluginPackage, {
+            tileSize: 768,
+            overlapPx: 2.5,
+            extraRings: 0,
+        }),
+        createPluginRegistration(InteractionManagerPluginPackage),
+        createPluginRegistration(SelectionPluginPackage, {
+            marquee: { enabled: false },
+        }),
+        createPluginRegistration(SearchPluginPackage, {
+            showAllResults: true,
+        }),
+        createPluginRegistration(ThumbnailPluginPackage, {
+            width: THUMBNAIL_WIDTH,
+            gap: THUMBNAIL_GAP,
+            imagePadding: THUMBNAIL_IMAGE_PADDING,
+            labelHeight: THUMBNAIL_LABEL_HEIGHT,
+            paddingY: THUMBNAIL_PANE_PADDING_Y,
+            buffer: 3,
+            autoScroll: true,
+            scrollBehavior: 'auto',
+        }),
+        createPluginRegistration(ZoomPluginPackage, {
+            defaultZoomLevel: selectPdfZoomLevel(fitOnOpen, defaultZoom),
+            minZoom: ZOOM_OPTIONS[0],
+            maxZoom: ZOOM_OPTIONS[ZOOM_OPTIONS.length - 1],
+        }),
+        createPluginRegistration(RotatePluginPackage),
+    ]);
+    if (engineError) {
+        return (_jsx("div", { "data-slot": "pdf-viewer", className: cn('bg-background text-muted-foreground grid h-full w-full place-items-center p-6 text-sm', className), children: tI18nComplete.raw('text84658b676d2f') }));
+    }
+    if (!engine) {
+        return (_jsxs("div", { "data-slot": "pdf-viewer", className: cn('bg-background relative flex h-full max-h-full min-h-0 w-full flex-col overflow-hidden', className), children: [showToolbar ? _jsx("div", { className: "bg-background min-h-12 border-b" }) : null, _jsx("div", { className: "relative min-h-0 flex-1", children: _jsx(PDFViewerLoadingSkeleton, { sidebarInline: true, sidebarOpen: false }) })] }));
+    }
+    return (_jsx(EmbedPDF, { engine: engine, plugins: plugins, children: _jsx(PDFViewerDocumentLoader, { viewerRef: ref, pdfFile: pdfFile, defaultZoom: defaultZoom, className: className, fileName: fileName, showDownload: showDownload, showToolbar: showToolbar, showRotateControls: showRotateControls, showUpload: showUpload, toolbarActions: toolbarActions, pageClassName: pageClassName, renderPageOverlay: renderPageOverlay, onActivePageChange: onActivePageChange, onDocumentLoadSuccess: onDocumentLoadSuccess, onPdfUpload: onPdfUpload, onPagePointerDown: onPagePointerDown, onPagePointerMove: onPagePointerMove, onPagePointerUp: onPagePointerUp, onPagePointerCancel: onPagePointerCancel, onUploadFile: handleUploadFile }) }));
+});