Function default

Description

A UI component that renders a file tile with a preview thumbnail of the first page of a PDF. It uses pdfjs-dist to fetch and convert the first page into an image. A loading state is shown while rendering, and users can optionally delete the file using the delete button.

Remarks

This component is optimized for previewing PDF files only. It renders the first page as an image to avoid cross-origin or embedding issues that commonly arise with iframe or canvas previews. Rendering is handled in-browser.

Example

<FileTile
  fileName="Contract.pdf"
  url="https://example.com/contract.pdf"
/>

Example

<FileTile
  fileName="Report Q1.pdf"
  url="https://cdn.example.com/reports/q1.pdf"
  onDelete={() => console.log('deleted')}
/>

Settings

Member Visibility