From 95aacb55762207d6e82d13a1e59efc150197cafb Mon Sep 17 00:00:00 2001
From: Artem Nistuley <artem@harbourshare.com>
Date: Wed, 12 Mar 2025 17:57:52 +0200
Subject: [PATCH] export fixes

---
 .../assets/styles/elements/prosemirror.css    |  5 ++++
 .../src/core/super-converter/exporter.js      | 28 +++++++++++++++++--
 2 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/packages/super-editor/src/assets/styles/elements/prosemirror.css b/packages/super-editor/src/assets/styles/elements/prosemirror.css
index 4ea9c9a57c..251f5c6af7 100644
--- a/packages/super-editor/src/assets/styles/elements/prosemirror.css
+++ b/packages/super-editor/src/assets/styles/elements/prosemirror.css
@@ -84,6 +84,11 @@ li.ProseMirror-selectednode:after {
   pointer-events: none;
 }
 
+.ProseMirror img {
+  height: auto;
+  max-width: 100%;
+}
+
 /* Protect against generic img rules */
 img.ProseMirror-separator {
   display: inline !important;
diff --git a/packages/super-editor/src/core/super-converter/exporter.js b/packages/super-editor/src/core/super-converter/exporter.js
index 4021f84e89..bfcfd49654 100644
--- a/packages/super-editor/src/core/super-converter/exporter.js
+++ b/packages/super-editor/src/core/super-converter/exporter.js
@@ -918,9 +918,12 @@ function generateTableRowProperties(node) {
  * @returns {XmlReadyNode} The translated table cell node
  */
 function translateTableCell(params) {
-  const elements = translateChildNodes(params);
+  const elements = translateChildNodes({
+    ...params,
+    tableCell: params.node,
+  });
   const cellProps = generateTableCellProperties(params.node);
-
+  
   elements.unshift(cellProps);
   return {
     name: 'w:tc',
@@ -1179,6 +1182,7 @@ function getScaledSize(originalWidth, originalHeight, maxWidth, maxHeight) {
 function translateImageNode(params, imageSize) {
   const {
     node: { attrs = {}, marks = [] },
+    tableCell,
   } = params;
 
   let imageId = attrs.rId;
@@ -1202,6 +1206,16 @@ function translateImageNode(params, imageSize) {
     };
   }
   
+  if (tableCell) {
+    // Image inside tableCell
+    const colwidthSum = tableCell.attrs.colwidth.reduce((acc, curr) => acc + curr, 0);
+    const leftMargin = tableCell.attrs.cellMargins?.left || 8;
+    const rightMargin = tableCell.attrs.cellMargins?.right || 8;
+    const maxWidthEmu = pixelsToEmu(colwidthSum - (leftMargin + rightMargin));
+    const { width: w, height: h } = resizeKeepAspectRatio(size.w, size.h, maxWidthEmu);
+    if (w && h) size = { w, h };
+  }
+  
   if (params.node.type === 'image' && !imageId) {
     const path = src?.split('word/')[1];
     imageId = addNewImageRelationship(params, path);
@@ -1655,3 +1669,13 @@ export class DocxExporter {
     return tags;
   }
 }
+
+
+function resizeKeepAspectRatio(width, height, maxWidth) {
+  if (width > maxWidth) {
+    let scale = maxWidth / width;
+    let newHeight = Math.round(height * scale);
+    return { width: maxWidth, height: newHeight };
+  }
+  return { width, height };
+}