Export with embedpdf

frontend/src/components/shared/RightRail.tsx

@@ -65,6 +65,9 @@ export default function RightRail() {
 
   const { totalItems, selectedCount } = getSelectionState();
 
+  // Get export state for viewer mode
+  const exportState = viewerContext?.getExportState?.();
+
   const handleSelectAll = useCallback(() => {
     if (currentView === 'fileEditor' || currentView === 'viewer') {
       // Select all file IDs
@@ -91,7 +94,10 @@ export default function RightRail() {
   }, [currentView, setSelectedFiles, pageEditorFunctions]);
 
   const handleExportAll = useCallback(() => {
-    if (currentView === 'fileEditor' || currentView === 'viewer') {
+    if (currentView === 'viewer') {
+      // Use EmbedPDF export functionality for viewer mode
+      viewerContext?.exportActions?.download();
+    } else if (currentView === 'fileEditor') {
       // Download selected files (or all if none selected)
       const filesToDownload = selectedFiles.length > 0 ? selectedFiles : activeFiles;
 
@@ -108,7 +114,7 @@ export default function RightRail() {
       // Export all pages (not just selected)
       pageEditorFunctions?.onExportAll?.();
     }
-  }, [currentView, activeFiles, selectedFiles, pageEditorFunctions]);
+  }, [currentView, activeFiles, selectedFiles, pageEditorFunctions, viewerContext]);
 
   const handleCloseSelected = useCallback(() => {
     if (currentView !== 'fileEditor') return;
@@ -440,7 +446,9 @@ export default function RightRail() {
                 radius="md"
                 className="right-rail-icon"
                 onClick={handleExportAll}
-                disabled={currentView === 'viewer' || totalItems === 0}
+                disabled={
+                  currentView === 'viewer' ? !exportState?.canExport : totalItems === 0
+                }
               >
                 <LocalIcon icon="download" width="1.5rem" height="1.5rem" />
               </ActionIcon>

frontend/src/components/viewer/ExportAPIBridge.tsx

@@ -0,0 +1,25 @@
+import { useEffect } from 'react';
+import { useExportCapability } from '@embedpdf/plugin-export/react';
+import { useViewer } from '../../contexts/ViewerContext';
+
+/**
+ * Component that runs inside EmbedPDF context and provides export functionality
+ */
+export function ExportAPIBridge() {
+  const { provides: exportApi } = useExportCapability();
+  const { registerBridge } = useViewer();
+
+  useEffect(() => {
+    if (exportApi) {
+      // Register this bridge with ViewerContext
+      registerBridge('export', {
+        state: {
+          canExport: true,
+        },
+        api: exportApi
+      });
+    }
+  }, [exportApi, registerBridge]);
+
+  return null;
+}

frontend/src/components/viewer/LocalEmbedPDF.tsx

@@ -17,6 +17,7 @@ import { SpreadPluginPackage, SpreadMode } from '@embedpdf/plugin-spread/react';
 import { SearchPluginPackage } from '@embedpdf/plugin-search/react';
 import { ThumbnailPluginPackage } from '@embedpdf/plugin-thumbnail/react';
 import { RotatePluginPackage, Rotate } from '@embedpdf/plugin-rotate/react';
+import { ExportPluginPackage } from '@embedpdf/plugin-export/react';
 import { Rotation } from '@embedpdf/models';
 import { CustomSearchLayer } from './CustomSearchLayer';
 import { ZoomAPIBridge } from './ZoomAPIBridge';
@@ -29,6 +30,7 @@ import { SpreadAPIBridge } from './SpreadAPIBridge';
 import { SearchAPIBridge } from './SearchAPIBridge';
 import { ThumbnailAPIBridge } from './ThumbnailAPIBridge';
 import { RotateAPIBridge } from './RotateAPIBridge';
+import { ExportAPIBridge } from './ExportAPIBridge';
 
 interface LocalEmbedPDFProps {
   file?: File | Blob;
@@ -112,6 +114,11 @@ export function LocalEmbedPDF({ file, url }: LocalEmbedPDFProps) {
       createPluginRegistration(RotatePluginPackage, {
         defaultRotation: Rotation.Degree0, // Start with no rotation
       }),
+
+      // Register export plugin for downloading PDFs
+      createPluginRegistration(ExportPluginPackage, {
+        defaultFileName: 'document.pdf',
+      }),
     ];
   }, [pdfUrl]);
 
@@ -170,6 +177,7 @@ export function LocalEmbedPDF({ file, url }: LocalEmbedPDFProps) {
         <SearchAPIBridge />
         <ThumbnailAPIBridge />
         <RotateAPIBridge />
+        <ExportAPIBridge />
         <GlobalPointerProvider>
           <Viewport
             style={{

frontend/src/contexts/ViewerContext.tsx

@@ -51,6 +51,11 @@ interface ThumbnailAPIWrapper {
   renderThumb: (pageIndex: number, scale: number) => { toPromise: () => Promise<Blob> };
 }
 
+interface ExportAPIWrapper {
+  download: () => void;
+  saveAsCopy: () => { toPromise: () => Promise<ArrayBuffer> };
+}
+
 
 // State interfaces - represent the shape of data from each bridge
 interface ScrollState {
@@ -93,6 +98,10 @@ interface SearchState {
   activeIndex: number;
 }
 
+interface ExportState {
+  canExport: boolean;
+}
+
 // Bridge registration interface - bridges register with state and API
 interface BridgeRef<TState = unknown, TApi = unknown> {
   state: TState;
@@ -122,6 +131,7 @@ interface ViewerContextType {
   getRotationState: () => RotationState;
   getSearchState: () => SearchState;
   getThumbnailAPI: () => ThumbnailAPIWrapper | null;
+  getExportState: () => ExportState;
 
   // Immediate update callbacks
   registerImmediateZoomUpdate: (callback: (percent: number) => void) => void;
@@ -179,6 +189,11 @@ interface ViewerContextType {
     clear: () => void;
   };
 
+  exportActions: {
+    download: () => void;
+    saveAsCopy: () => Promise<ArrayBuffer | null>;
+  };
+
   // Bridge registration - internal use by bridges  
   registerBridge: (type: string, ref: BridgeRef) => void;
 }
@@ -203,6 +218,7 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     spread: null as BridgeRef<SpreadState, SpreadAPIWrapper> | null,
     rotation: null as BridgeRef<RotationState, RotationAPIWrapper> | null,
     thumbnail: null as BridgeRef<unknown, ThumbnailAPIWrapper> | null,
+    export: null as BridgeRef<ExportState, ExportAPIWrapper> | null,
   });
 
   // Immediate zoom callback for responsive display updates
@@ -238,6 +254,9 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
       case 'thumbnail':
         bridgeRefs.current.thumbnail = ref as BridgeRef<unknown, ThumbnailAPIWrapper>;
         break;
+      case 'export':
+        bridgeRefs.current.export = ref as BridgeRef<ExportState, ExportAPIWrapper>;
+        break;
     }
   };
 
@@ -278,6 +297,10 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     return bridgeRefs.current.thumbnail?.api || null;
   };
 
+  const getExportState = (): ExportState => {
+    return bridgeRefs.current.export?.state || { canExport: false };
+  };
+
   // Action handlers - call APIs directly
   const scrollActions = {
     scrollToPage: (page: number) => {
@@ -473,6 +496,28 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     }
   };
 
+  const exportActions = {
+    download: () => {
+      const api = bridgeRefs.current.export?.api;
+      if (api?.download) {
+        api.download();
+      }
+    },
+    saveAsCopy: async () => {
+      const api = bridgeRefs.current.export?.api;
+      if (api?.saveAsCopy) {
+        try {
+          const result = api.saveAsCopy();
+          return await result.toPromise();
+        } catch (error) {
+          console.error('Failed to save PDF copy:', error);
+          return null;
+        }
+      }
+      return null;
+    }
+  };
+
   const registerImmediateZoomUpdate = (callback: (percent: number) => void) => {
     immediateZoomUpdateCallback.current = callback;
   };
@@ -507,6 +552,7 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     getRotationState,
     getSearchState,
     getThumbnailAPI,
+    getExportState,
 
     // Immediate updates
     registerImmediateZoomUpdate,
@@ -522,6 +568,7 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     spreadActions,
     rotationActions,
     searchActions,
+    exportActions,
 
     // Bridge registration
     registerBridge,