Merge pull request #344 from NotionX/zoom-option

added prop for isImageZoomable to renderer

Author: normdoow

packages/react-notion-x/src/components/asset-wrapper.tsx

@@ -13,7 +13,7 @@ export const AssetWrapper: React.FC<{
   block: Block
 }> = ({ blockId, block }) => {
   const value = block as BaseContentBlock
-  const { components, mapPageUrl, rootDomain } = useNotionContext()
+  const { components, mapPageUrl, rootDomain, zoom } = useNotionContext()
 
   let isURL = false
   if (block.type === 'image') {
@@ -37,7 +37,7 @@ export const AssetWrapper: React.FC<{
         blockId
       )}
     >
-      <Asset block={value} zoomable={!isURL}>
+      <Asset block={value} zoomable={zoom && !isURL}>
         {value?.properties?.caption && !isURL && (
           <figcaption className='notion-asset-caption'>
             <Text value={value.properties.caption} block={block} />

packages/react-notion-x/src/renderer.tsx

@@ -31,6 +31,7 @@ export const NotionRenderer: React.FC<{
   forceCustomImages?: boolean
   showCollectionViewDropdown?: boolean
   linkTableTitleProperties?: boolean
+  isImageZoomable?: boolean
 
   showTableOfContents?: boolean
   minTableOfContentsItems?: number
@@ -67,6 +68,7 @@ export const NotionRenderer: React.FC<{
   forceCustomImages,
   showCollectionViewDropdown,
   linkTableTitleProperties,
+  isImageZoomable = true,
   showTableOfContents,
   minTableOfContentsItems,
   defaultPageIcon,
@@ -105,7 +107,7 @@ export const NotionRenderer: React.FC<{
       defaultPageIcon={defaultPageIcon}
       defaultPageCover={defaultPageCover}
       defaultPageCoverPosition={defaultPageCoverPosition}
-      zoom={zoom}
+      zoom={isImageZoomable ? zoom : null}
     >
       <NotionBlockRenderer {...rest} />
     </NotionContextProvider>