diff --git a/.gitignore b/.gitignore index 6f2b995..f5af0e6 100644 --- a/.gitignore +++ b/.gitignore @@ -8,3 +8,4 @@ dist/ # NPM file created by GitHub actions .npmrc +.idea/ diff --git a/package.json b/package.json index 8acb522..afc2533 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-fast-pdf", - "version": "1.0.25", + "version": "1.0.26", "description": "react-fast-pdf", "main": "./dist/index.js", "files": [ diff --git a/src/PDFPreviewer.tsx b/src/PDFPreviewer.tsx index a36ab93..eec96f9 100644 --- a/src/PDFPreviewer.tsx +++ b/src/PDFPreviewer.tsx @@ -67,11 +67,12 @@ function PDFPreviewer({ const [isPasswordInvalid, setIsPasswordInvalid] = useState(false); const containerRef = useRef(null); const onPasswordCallbackRef = useRef(null); + const listRef = useRef(null); /** * Calculate the devicePixelRatio the page should be rendered with * Each platform has a different default devicePixelRatio and different canvas limits, we need to verify that - * with the default devicePixelRatio it will be able to diplay the pdf correctly, if not we must change the devicePixelRatio. + * with the default devicePixelRatio it will be able to display the pdf correctly, if not we must change the devicePixelRatio. * @param {Number} width of the page * @param {Number} height of the page * @returns {Number} devicePixelRatio for this page on this platform @@ -206,6 +207,15 @@ function PDFPreviewer({ ); }, [isPasswordInvalid, attemptPDFLoad, setIsPasswordInvalid, renderPasswordForm]); + /** + * Reset List style cache when dimensions change + */ + useLayoutEffect(() => { + if (containerWidth > 0 && containerHeight > 0) { + listRef.current?.resetAfterIndex(0); + } + }, [containerWidth, containerHeight]); + useLayoutEffect(() => { if (!containerRef.current) { return undefined; @@ -240,6 +250,7 @@ function PDFPreviewer({ > {pageViewports.length > 0 && (