NotionX / react-notion-x

Fast and accurate React renderer for Notion. TS batteries included. ⚡️
https://react-notion-x-demo.transitivebullsh.it
MIT License
4.87k stars 570 forks source link

Support for new Next.js Image componentin Next.js v12.3 #370

Open vader1359 opened 2 years ago

vader1359 commented 2 years ago

It seems we have a new stable Image component in Next.js in version 12.3 with a lot of improvement. Will react-notion-x support this?

vincelwt commented 2 years ago

I was able to make it work by forcing width/height like this:

import Image from 'next/future/image'

<NotionRenderer
        recordMap={blockMap}
        forceCustomImages={true}
        previewImages={true}
        components={{
          Image: (props) => (
            <Image {...props} width={1920} height={1080} />
          ),
     }}
/>

The image renders with the correct original size, not 1920x1080.