PdfViewer EXPERIMENTAL

Examples Setup
See also
Preview

Wrapper component for viewing PDF files in an iframe

PDF display in browsers is handled by each browser independently, using their own homegrown or 3rd-party code, as this is not part of the HTML spec. Keep in mind most mobile devices do not support displaying PDFs in iframe. Check it here . The only way to enforce rendering consistency in all browsers is to do the rendering server-side, bundle your own JS PDF renderer, or use a 3rd-party rendering service. If you want to display it yourself, so you need to rely on TUI_IS_MOBILE token to provide suitable alternative behavior. For example, you can use third-party service https://drive.google.com/viewerng/viewer?embedded=true&url=$YOUR_PUBLIC_PATH_TO_PDF or your own service to render PDF by pdf.js.

Basic

#

Note that you need to bypass sanitizer in order to use the URL so make sure you trust it

With responsive dialog

#

Use ResponsiveDialog to display iframe in a SheetDialog on mobile devices

Loading and error states

#

Use Loader and BlockStatus to display additional states