support maxWidth for pdf viewer

Author: lebalz

docs/tdev/gallery/markdown/remark-pdf/index.mdx

@@ -7,11 +7,11 @@ import BrowserWindow from '@tdev-components/BrowserWindow';
 # PDF Viewer
 
 ```md
-::pdf[./assets/lehrplan-ofi.pdf]
+::pdf[./assets/lehrplan-ofi.pdf]{maxHeight=450px}
 ```
 
-<BrowserWindow maxHeight={'450px'}>
-::pdf[./assets/lehrplan-ofi.pdf]
+<BrowserWindow>
+::pdf[./assets/lehrplan-ofi.pdf]{maxHeight=450px}
 </BrowserWindow>
 
 ## Optionen
@@ -30,10 +30,10 @@ import BrowserWindow from '@tdev-components/BrowserWindow';
 : Breite des PDF Viewers.
 : Standardmässig auf __100%__ gesetzt.
 : z.B. `width=200px`
-`height`
-: Höhe des PDF Viewers.
+`maxHeight`
+: Höhe des PDF Viewers, nicht aber des PDF Dokuments.
 : Standardmässig wird eine ganze Seite angezeigt.
-: z.B. `height=200px`
+: z.B. `maxHeight=200px`
 
 
 ### Einzelne Seite anzeigen (`page`)

packages/tdev/remark-pdf/PdfViewer/PdfViewer.tsx

@@ -17,6 +17,7 @@ export interface Props {
     page?: number;
     scroll?: boolean;
     width?: number;
+    maxHeight?: number | string;
     minWidth?: number;
     scale?: number;
     noDownload?: boolean;
@@ -128,6 +129,7 @@ const PdfViewer = (props: Props) => {
                 props.scroll && styles.scroll,
                 (numPages <= 1 || props.page !== undefined) && styles.singlepage
             )}
+            style={{ maxHeight: props.maxHeight, overflowY: props.maxHeight ? 'auto' : undefined }}
             ref={ref}
         >
             <div style={{ height: `${height + 8}px` }}>

packages/tdev/remark-pdf/remark-plugin/index.ts

@@ -49,6 +49,7 @@ const PdfViewerNode = (
             attr.scroll !== undefined && toJsxAttribute('scroll', attr.scroll),
             attr.page !== undefined && toJsxAttribute('page', attr.page),
             attr.width !== undefined && toJsxAttribute('width', attr.width),
+            attr.maxHeight !== undefined && toJsxAttribute('maxHeight', attr.maxHeight),
             attr.minWidth !== undefined && toJsxAttribute('minWidth', attr.minWidth),
             attr.noDownload !== undefined && toJsxAttribute('noDownload', attr.noDownload),
             attr.scale !== undefined && toJsxAttribute('scale', attr.scale),