Bypass Sharp for animated GIFs in DocImage and ImageGallery (#417)

The default Sharp pipeline re-encodes GIFs to WebP, which drops every
frame after the first (losing animation) and also blows past Sharp's
default pixel limit on large multi-frame GIFs — e.g.
shared-subscription-demo.gif (1846x1004, 317 frames) fails the build
with "Input image exceeds pixel limit". GIFs now skip raster processing
and are served as-is, the same way SVGs already are.

Author: vvlladd28

src/components/DocImage.astro

@@ -47,6 +47,7 @@ const svgRawModules = import.meta.glob<string>(
 
 const mod = assetModules[src];
 const isSvg = src.endsWith('.svg');
+const isGif = src.endsWith('.gif');
 const rawSvg = isSvg ? await svgRawModules[src]?.() : undefined;
 let interactiveSvg = rawSvg && /<a[\s>]/i.test(rawSvg) ? rawSvg : null;
 
@@ -79,8 +80,9 @@ if (interactiveSvg) {
 		return `<a${stripped} target="_blank" rel="noopener noreferrer">`;
 	});
 }
+// GIFs bypass Sharp: WebP re-encode drops animation frames after the first.
 const optimized =
-	mod && !isSvg
+	mod && !isSvg && !isGif
 		? await getImage({
 				src: mod.default,
 				...(numericWidth ? { width: numericWidth } : {}),

src/components/ImageGallery.astro

@@ -169,6 +169,7 @@ const processed = await Promise.all(
 		}
 
 		const isSvg = lightPath.endsWith('.svg');
+		const isGif = lightPath.endsWith('.gif');
 
 		// SVGs skip raster processing. If they contain `<a>`, inline them so anchors stay clickable.
 		if (isSvg) {
@@ -196,6 +197,27 @@ const processed = await Promise.all(
 			};
 		}
 
+		// GIFs bypass Sharp: WebP re-encode drops animation frames after the first.
+		if (isGif) {
+			const lightSrc = lightMod.default.src;
+			const darkMod = hasDark ? assetModules[darkPath] : null;
+			const darkSrc = darkMod ? darkMod.default.src : lightSrc;
+
+			return {
+				alt,
+				caption: captionToHtml(caption ?? ''),
+				thumbSrc: lightSrc,
+				fullSrc: lightSrc,
+				darkThumbSrc: darkSrc,
+				darkFullSrc: darkSrc,
+				fullWidth: lightMod.default.width,
+				fullHeight: lightMod.default.height,
+				hasDark,
+				interactiveSvg: undefined,
+				isCdn: false,
+			};
+		}
+
 		const thumb = await getImage({
 			src: lightMod.default,
 			width: 800,