Preserve QWord subscript superscript in DOCX

2026-06-02 07:24:42 +03:00
parent 7ace47dd2a
commit b8c347142a
4 changed files with 100 additions and 3 deletions
@@ -11,6 +11,8 @@ export interface WordInlineRun {
  italics?: boolean;
  underline?: boolean;
  strike?: boolean;
+  subscript?: boolean;
+  superscript?: boolean;
  href?: string;
  color?: string;
  highlightColor?: string;
@@ -415,6 +417,11 @@ function wordInlineRunToTextRunOption(run: WordInlineRun) {
  if (run.strike) {
    options.strike = true;
  }
+  if (run.superscript) {
+    options.superScript = true;
+  } else if (run.subscript) {
+    options.subScript = true;
+  }
  if (run.color) {
    options.color = run.color;
  }
@@ -734,6 +741,11 @@ function cssFontFamilyStyleValue(style: string) {
  return normalizedFontFamily(firstFamily);
 }

+function cssVerticalAlignValue(style: string) {
+  const raw = /(?:^|;)\s*vertical-align\s*:\s*([^;]+)/i.exec(style)?.[1]?.trim().toLowerCase() ?? "";
+  return ["sub", "super"].includes(raw) ? raw : "";
+}
+
 function normalizedCssColor(value: string) {
  const raw = value.trim().toLowerCase();
  if (!raw || ["transparent", "inherit", "initial", "currentcolor", "auto"].includes(raw)) {
@@ -1326,7 +1338,10 @@ function docxRunToHtml(run: unknown, imageDataByRelationshipId: DocxImageDataByR
  const fontSize = docxRunFontSize(properties);
  const fontFamily = docxRunFontFamily(properties);
  const hasStrike = hasDocxBoolean(properties, "w:strike") || hasDocxBoolean(properties, "w:dstrike");
-  const hasInlineColorOrHighlight = Boolean(color || highlightColor || fontSize || fontFamily || hasStrike);
+  const verticalAlign = docxRunVerticalAlign(properties);
+  const hasSubscript = verticalAlign === "subscript";
+  const hasSuperscript = verticalAlign === "superscript";
+  const hasInlineColorOrHighlight = Boolean(color || highlightColor || fontSize || fontFamily || hasStrike || hasSubscript || hasSuperscript);
  const hasLineBreak = text.includes("\n");
  const hasPageBreak = text.includes(pageBreakMarker);
  const hasTab = text.includes("\t");
@@ -1360,6 +1375,11 @@ function docxRunToHtml(run: unknown, imageDataByRelationshipId: DocxImageDataByR
    if (styles.length > 0) {
      html = `<span style="${styles.join(" ")}">${html}</span>`;
    }
+    if (hasSubscript) {
+      html = `<sub>${html}</sub>`;
+    } else if (hasSuperscript) {
+      html = `<sup>${html}</sup>`;
+    }
  }

  return { html: `${imageHtml}${text ? html : ""}`, hasInlineColorOrHighlight, hasImage: Boolean(imageHtml), hasLineBreak, hasPageBreak, hasTab };
@@ -1530,6 +1550,10 @@ function docxRunFontFamily(properties: XmlRecord) {
  );
 }

+function docxRunVerticalAlign(properties: XmlRecord) {
+  return docxAttribute(childRecord(properties, "w:vertAlign"), "w:val").trim().toLowerCase();
+}
+
 function normalizedDocxHexColor(value: string) {
  const normalized = value.trim().toUpperCase();
  if (!normalized || normalized === "AUTO" || normalized === "NONE") {
@@ -1653,12 +1677,19 @@ function formatForElement(element: Element, inherited: InlineFormat): InlineForm
    cssColorValue(style, "background-color") || cssColorValue(style, "background") || inherited.highlightColor;
  const fontSize = cssFontSizeValue(style) ?? inherited.fontSize;
  const fontFamily = cssFontFamilyStyleValue(style) || inherited.fontFamily;
+  const verticalAlign = cssVerticalAlignValue(style);
+  const isSubscript = tagName === "sub" || verticalAlign === "sub";
+  const isSuperscript = tagName === "sup" || verticalAlign === "super";
+  const subscript = isSubscript ? true : isSuperscript ? false : inherited.subscript;
+  const superscript = isSuperscript ? true : isSubscript ? false : inherited.superscript;

  return cleanInlineFormat({
    bold: inherited.bold || tagName === "b" || tagName === "strong" || /font-weight\s*:\s*(bold|[6-9]00)\b/i.test(style),
    italics: inherited.italics || tagName === "i" || tagName === "em" || /font-style\s*:\s*italic\b/i.test(style),
    underline: inherited.underline || tagName === "u" || /text-decoration(?:-line)?\s*:[^;]*underline/i.test(style),
    strike: inherited.strike || tagName === "s" || tagName === "strike" || tagName === "del" || /text-decoration(?:-line)?\s*:[^;]*line-through/i.test(style),
+    ...(subscript ? { subscript } : {}),
+    ...(superscript ? { superscript } : {}),
    ...(href ? { href } : {}),
    ...(color ? { color } : {}),
    ...(highlightColor ? { highlightColor } : {}),
@@ -1700,6 +1731,8 @@ function sameInlineFormat(first: InlineFormat, second: InlineFormat) {
    Boolean(first.italics) === Boolean(second.italics) &&
    Boolean(first.underline) === Boolean(second.underline) &&
    Boolean(first.strike) === Boolean(second.strike) &&
+    Boolean(first.subscript) === Boolean(second.subscript) &&
+    Boolean(first.superscript) === Boolean(second.superscript) &&
    (first.href ?? "") === (second.href ?? "") &&
    (first.color ?? "") === (second.color ?? "") &&
    (first.highlightColor ?? "") === (second.highlightColor ?? "") &&
@@ -1714,6 +1747,7 @@ function cleanInlineFormat(format: InlineFormat): InlineFormat {
    ...(format.italics ? { italics: true } : {}),
    ...(format.underline ? { underline: true } : {}),
    ...(format.strike ? { strike: true } : {}),
+    ...(format.superscript ? { superscript: true } : format.subscript ? { subscript: true } : {}),
    ...(format.href ? { href: format.href } : {}),
    ...(format.color ? { color: format.color } : {}),
    ...(format.highlightColor ? { highlightColor: format.highlightColor } : {}),