fix: PDF and Office preview zoom drifts, stalls, and loses track of its label (#33836)

Fixes several zoom problems in the Files pane preview (pdf, docx, and
pptx, which the backend converts to PDF):

- Switching tabs and back reset the page to 100% while the label kept the
  old percentage. Hidden tabs measure 0 px wide, so PdfPagesPreview
  collapsed its thumbnails; their return resized the viewer, which
  re-rendered every page. PdfPagesPreview now keeps its layout while hidden,
  so the chosen zoom stays.
- Changing slides in a pptx reset the zoom to 100% while the label kept
  the old value. A slide change now carries the zoom and position over to
  the new slide.
- A pane resize rebuilt the zoom at 100% but left the label at the old
  value. renderAllPages now resets the label with it.
- On pptx slides, zooming drifted off-center and stopped at about 244%.
  The element panzoom transforms was flex-centered inside its container,
  while panzoom measures bounds and zoom anchors from the container's
  top-left corner. That element now fills the container and centers the
  slide inside it, so the coordinates match the screen.
- Resetting from a low zoom left the page off to the side, and from a
  stalled high zoom it could leave the page enlarged under a 100% label.
  The reset moved and zoomed through panzoom's bounds check, which skips
  the scale change when it adjusts the position. The reset now rebuilds
  the panzoom instance, as every render already does.

src/lib/components/common/PDFViewer.svelte

@@ -319,8 +319,7 @@
 
 	export const resetView = () => {
 		if (pzInstance) {
-			pzInstance.moveTo(0, 0);
-			pzInstance.zoomAbs(0, 0, 1);
+			initPanzoom();
 			zoomLevel = 1;
 			rerenderPages(1);
 		}
@@ -529,11 +528,19 @@
 			wrappers.push(wrapper);
 		}
 
+		const { x, y, scale } = pzInstance?.getTransform() ?? { x: 0, y: 0, scale: 1 };
+		const keepView =
+			singlePage && renderedPage && renderedPage !== selectedPage && Math.abs(scale - 1) >= 0.01;
 		sceneElement.replaceChildren(...wrappers);
 		void renderCommentMarkers();
 		lastRenderedZoom = 1;
+		zoomLevel = 1;
 		renderedPage = singlePage ? selectedPage : 0;
 		initPanzoom();
+		if (keepView) {
+			pzInstance?.zoomAbs(0, 0, scale);
+			pzInstance?.moveTo(x, y);
+		}
 		await scrollToTargetPage();
 		syncVisiblePage();
 	};
@@ -714,9 +721,7 @@
 	{/if}
 
 	<div
-		class={singlePage
-			? 'overflow-hidden h-full flex items-center justify-center overscroll-contain'
-			: 'overflow-y-auto h-full'}
+		class={singlePage ? 'overflow-hidden h-full overscroll-contain' : 'overflow-y-auto h-full'}
 		bind:this={outerContainer}
 		role="application"
 		aria-label={`${itemLabel} viewer`}
@@ -727,7 +732,10 @@
 		on:pointerdown={focusViewer}
 		on:keydown={handleKeyDown}
 	>
-		<div bind:this={sceneElement} class={singlePage ? '' : 'w-full'}></div>
+		<div
+			bind:this={sceneElement}
+			class={singlePage ? 'w-full h-full flex items-center justify-center' : 'w-full'}
+		></div>
 	</div>
 
 	{#if !error && pdfDoc}

src/lib/components/common/PdfPagesPreview.svelte

@@ -40,6 +40,7 @@
 		pdfData instanceof Uint8Array ? pdfData.slice() : pdfData.slice(0);
 
 	const updateLayout = () => {
+		if (rootEl && !rootEl.clientWidth) return;
 		hideThumbs = (rootEl?.clientWidth ?? window.innerWidth) < 720;
 	};