title: Display a PDF in the browser in a modal from blob data using react-pdf (@react-pdf/renderer)
body: <p>I am using the handy react-pdf library to render/display/download pdf's in my React site.  I have my PDF's stored on the server.  I have a call to the server that sends back the PDF in blob form.  Now I want to display that PDF in the browser in a modal when the user clicks a link.  I'm not finding and concrete examples on their site, <a href="https://react-pdf.org/" rel="nofollow noreferrer">https://react-pdf.org/</a> .  I'm not sure if I should be using PDFViewer, <a href="https://react-pdf.org/components#pdfviewer" rel="nofollow noreferrer">https://react-pdf.org/components#pdfviewer</a> or BlobProvider, <a href="https://react-pdf.org/components#blobprovider" rel="nofollow noreferrer">https://react-pdf.org/components#blobprovider</a></p>
  <p>I'm sure this is a fairly easy task, but I'm just not able to find any good examples anywhere.</p>
  <p>I fee like the closest example would be here from their site:</p>
  <pre class="lang-js prettyprint-override"><code>import { BlobProvider, Document, Page } from '@react-pdf/renderer';
  
  const MyDoc = (
    &lt;Document&gt;
      &lt;Page&gt;
        // My document data
      &lt;/Page&gt;
    &lt;/Document&gt;
  );
  
  const App = () =&gt; (
    &lt;div&gt;
      &lt;BlobProvider document={MyDoc}&gt;
        {({ blob, url, loading, error }) =&gt; {
          // Do whatever you need with blob here
          return &lt;div&gt;There's something going on on the fly&lt;/div&gt;
        }}
      &lt;/BlobProvider&gt;
    &lt;/div&gt;
  );
  </code></pre>