Function pdf

  • pdf(props): Element

  • Creates a PDF viewer component for displaying PDF files.

    Parameters

    • props: PDFBlockProps

      Configuration object

    Returns Element

    A JSX element representing the PDF viewer component

    Remarks

    • The component supports multiple source formats:
      • Base64 encoded PDF strings
      • Blob URLs (starting with 'blob:')
      • Data URLs (starting with 'data:application/pdf;base64,')
    • To obtain base64 from various sources, use mwFile helpers such as:
      • mwFileFromDrive: For files from drive
      • mwFileFromUrl: For files from URLs
    • The component is commonly used within a splitView layout

    Example

    Basic usage with base64 string

    pdf({
      name: 'pdf-viewer',
      src: 'base64-encoded-pdf-string'
    });

    Example

    Usage with blob URL

    pdf({
      name: 'pdf-viewer',
      src: 'blob:http://example.com/123-456-789'
    });

    Example

    Usage with data URL

    pdf({
      name: 'pdf-viewer',
      src: 'data:application/pdf;base64,base64-encoded-pdf-string'
    });

    Example

    Usage with mwFile helper and splitView

    const mwFile = await mwFileFromUrl(
      ctx,
      'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf'
    );

    const splitData = await showUI(
      ctx,
      splitView(
        {title: 'Document Viewer'},
        [
          pdf({
            name: 'pdf',
            src: mwFile.base64()
          })
        ],
        [
          // Other UI components
        ]
      )
    );

Settings