Callout margin reference improvement

Author: dragonstyle

news/changelog-1.3.md

@@ -4,6 +4,10 @@
 
 - Improve the performance of extremely large documents with margin elements by improving the efficiency of positioning the elements.
 
+## HTML Format
+
+- Improved handling of margin references that appear within a callout. (#3003)
+
 ## Dates
 
 - Properly fall back to language only locale when a supported language-region locale isn't available. (#3059)

src/format/html/format-html-bootstrap.ts

@@ -936,6 +936,28 @@ const marginContainerForEl = (el: Element, doc: Document) => {
     }
   }
 
+  // Find the callout parent and create a container for the callout there
+  // Walks up the parent stack until a callout element is found
+  const findCalloutEl = (el: Element): Element | undefined => {
+    console.log(el.parentElement?.classList);
+    if (el.parentElement?.classList.contains("callout")) {
+      return el.parentElement;
+    } else if (el.parentElement) {
+      return findCalloutEl(el.parentElement);
+    } else {
+      return undefined;
+    }
+  };
+  const calloutEl = findCalloutEl(el);
+  if (calloutEl) {
+    const container = createMarginContainer(doc);
+    calloutEl.parentNode?.insertBefore(
+      container,
+      calloutEl.nextElementSibling,
+    );
+    return container;
+  }
+
   // Deal with a paragraph
   const parentEl = el.parentElement;
   const cantContainBlockTags = ["P"];