@particle-academy/fancy-slides 0.6.0 → 0.6.1

package/dist/index.cjs

@@ -1658,6 +1658,11 @@ function SlideThumbnail({
   className,
   style
 }) {
+  const resolved = resolveTheme(theme);
+  const ratio = resolved.aspectRatio ?? 16 / 9;
+  const designWidth = resolved.slideWidth ?? 1280;
+  const scale = width / designWidth;
+  const height = width / ratio;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1670,12 +1675,27 @@ function SlideThumbnail({
         boxShadow: active ? "0 0 0 3px rgba(139, 92, 246, 0.2)" : "0 1px 2px rgba(0,0,0,0.05)",
         background: "#ffffff",
         width,
+        height,
         ...style
       },
       onClick,
       onContextMenu,
       "data-fancy-slides-thumbnail": slide.id,
-      children: /* @__PURE__ */ jsxRuntime.jsx(Slide, { slide, theme, width, renderElement })
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          style: {
+            width: designWidth,
+            height: designWidth / ratio,
+            transform: `scale(${scale})`,
+            transformOrigin: "top left",
+            // The thumb owns interaction — charts/code/iframes inside the
+            // scaled slide shouldn't capture clicks.
+            pointerEvents: "none"
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsx(Slide, { slide, theme, width: designWidth, renderElement })
+        }
+      )
     }
   );
 }