Copy & Paste

Copy and paste work together as one canvas-local clipboard flow. The parent tells the canvas which pages to copy, then later tells it where to paste them.

The parent application never sends page bytes, base64, or a file object between these two actions. The clipboard exists only inside the same canvas session.

• page-copy uses pageRange.
• page-paste uses targetPageIndex.
• Paste only works after a successful copy in the same canvas session.
• If targetPageIndex is missing, paste fails even if the action name is correct.

Invoke page actions in sequence to achieve copy and paste.

// 1. Copy page index 1, 2, 3
await viewer.documents.manipulatePages({
  action: "page-copy",
  pageRange: [[1, 3]]
});

// 2. Paste copied pages at index 5
await viewer.documents.manipulatePages({
  action: "page-paste",
  targetPageIndex: 5
});

Example showing how to copy and paste programmatically:

import { createViewer } from "@rasterex/viewer";

const viewer = createViewer({
  container: "#viewer"
});

await viewer.mount();
await viewer.ready();

async function executeCopyPasteFlow(srcIndex: number, destIndex: number): Promise<void> {
  try {
    // Copy the selected page
    await viewer.documents.manipulatePages({
      action: "page-copy",
      pageRange: [[srcIndex]]
    });

    // Paste the page at the destination
    await viewer.documents.manipulatePages({
      action: "page-paste",
      targetPageIndex: destIndex
    });
    console.log("Copy and Paste completed successfully");
  } catch (error) {
    console.error("Copy paste operation failed:", error);
  }
}

Open the focused demo to copy a page and paste it into another position in the same canvas session.