@tekkare/romulus 0.1.179 → 0.1.180

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "0.1.178",
+  "version": "0.1.179",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/composables/useRmExport.js

@@ -122,11 +122,30 @@ async function capture(el) {
       useCORS: true
     });
     if (!canvas.width || !canvas.height) return null;
-    return { data: canvas.toDataURL("image/png"), width: canvas.width, height: canvas.height };
+    return canvas;
   } catch {
     return null;
   }
 }
+function slice(canvas, top, height) {
+  const part = document.createElement("canvas");
+  part.width = canvas.width;
+  part.height = Math.max(1, Math.round(height));
+  const context = part.getContext("2d");
+  if (!context) return canvas.toDataURL("image/png");
+  context.drawImage(
+    canvas,
+    0,
+    Math.round(top),
+    canvas.width,
+    part.height,
+    0,
+    0,
+    canvas.width,
+    part.height
+  );
+  return part.toDataURL("image/png");
+}
 async function raster(markup, width, height, scale = 2) {
   const image = new Image();
   image.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(markup)}`;
@@ -585,28 +604,39 @@ export function useRmExport() {
     if (faithful) {
       sectionTitle(lang === "en" ? "Page" : "La page");
       for (const shot of shots) {
-        let drawWidth = inner;
-        let drawHeight = shot.height / shot.width * drawWidth;
-        const maxHeight = bottom - margin;
-        if (drawHeight > maxHeight) {
-          drawHeight = maxHeight;
-          drawWidth = shot.width / shot.height * drawHeight;
+        const drawWidth = inner;
+        const height = shot.height / shot.width * drawWidth;
+        const room = () => bottom - y;
+        if (height <= bottom - margin) {
+          if (height > room()) {
+            doc.addPage();
+            y = margin;
+          }
+          doc.addImage(shot.toDataURL("image/png"), "PNG", margin, y, drawWidth, height, void 0, "FAST");
+          y += height + 6;
+          continue;
         }
-        if (y + drawHeight > bottom) {
-          doc.addPage();
-          y = margin;
+        let drawn = 0;
+        while (drawn < height - 0.5) {
+          if (room() < 20) {
+            doc.addPage();
+            y = margin;
+          }
+          const band = Math.min(room(), height - drawn);
+          doc.addImage(
+            slice(shot, drawn / height * shot.height, band / height * shot.height),
+            "PNG",
+            margin,
+            y,
+            drawWidth,
+            band,
+            void 0,
+            "FAST"
+          );
+          drawn += band;
+          y += band;
         }
-        doc.addImage(
-          shot.data,
-          "PNG",
-          margin + (inner - drawWidth) / 2,
-          y,
-          drawWidth,
-          drawHeight,
-          void 0,
-          "FAST"
-        );
-        y += drawHeight + 6;
+        y += 6;
       }
     }
     let rowCount = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/romulus",
-  "version": "0.1.179",
+  "version": "0.1.180",
   "description": "Romulus Design System - Nuxt module by Tekkare",
   "license": "MIT",
   "type": "module",