@blocknote/xl-docx-exporter 0.19.0

package/src/docx/docxExporter.ts

@@ -0,0 +1,269 @@
+import {
+  Block,
+  BlockNoteSchema,
+  BlockSchema,
+  COLORS_DEFAULT,
+  InlineContentSchema,
+  StyleSchema,
+  StyledText,
+} from "@blocknote/core";
+import {
+  AlignmentType,
+  Document,
+  IRunPropertiesOptions,
+  ISectionOptions,
+  LevelFormat,
+  Packer,
+  Paragraph,
+  ParagraphChild,
+  Tab,
+  Table,
+  TextRun,
+} from "docx";
+
+import { Exporter, ExporterOptions } from "@blocknote/core";
+import { corsProxyResolveFileUrl } from "@shared/api/corsProxy.js";
+import { loadFileBuffer } from "@shared/util/fileUtil.js";
+
+// get constructor arg type from Document
+type DocumentOptions = Partial<ConstructorParameters<typeof Document>[0]>;
+
+const DEFAULT_TAB_STOP =
+  /* default font size */ 16 *
+  /* 1 pixel is 0.75 points */ 0.75 *
+  /* 1.5em*/ 1.5 *
+  /* 1 point is 20 twips */ 20;
+
+/**
+ * Exports a BlockNote document to a .docx file using the docxjs library.
+ */
+export class DOCXExporter<
+  B extends BlockSchema,
+  S extends StyleSchema,
+  I extends InlineContentSchema
+> extends Exporter<
+  B,
+  I,
+  S,
+  Promise<Paragraph[] | Paragraph | Table> | Paragraph[] | Paragraph | Table,
+  ParagraphChild,
+  IRunPropertiesOptions,
+  TextRun
+> {
+  public constructor(
+    /**
+     * The schema of your editor. The mappings are automatically typed checked against this schema.
+     */
+    protected readonly schema: BlockNoteSchema<B, I, S>,
+    /**
+     * The mappings that map the BlockNote schema to the docxjs content.
+     * Pass {@link docxDefaultSchemaMappings} for the default schema.
+     */
+    protected readonly mappings: Exporter<
+      NoInfer<B>,
+      NoInfer<I>,
+      NoInfer<S>,
+      | Promise<Paragraph[] | Paragraph | Table>
+      | Paragraph[]
+      | Paragraph
+      | Table,
+      ParagraphChild,
+      IRunPropertiesOptions,
+      TextRun
+    >["mappings"],
+    options?: Partial<ExporterOptions>
+  ) {
+    const defaults = {
+      colors: COLORS_DEFAULT,
+      resolveFileUrl: corsProxyResolveFileUrl,
+    } satisfies Partial<ExporterOptions>;
+
+    const newOptions = {
+      ...defaults,
+      ...options,
+    };
+    super(schema, mappings, newOptions);
+  }
+
+  /**
+   * Mostly for internal use, you probably want to use `toBlob` or `toDocxJsDocument` instead.
+   */
+  public transformStyledText(styledText: StyledText<S>, hyperlink?: boolean) {
+    const stylesArray = this.mapStyles(styledText.styles);
+
+    const styles: IRunPropertiesOptions = Object.assign(
+      {} as IRunPropertiesOptions,
+      ...stylesArray
+    );
+
+    return new TextRun({
+      ...styles,
+      style: hyperlink ? "Hyperlink" : undefined,
+      text: styledText.text,
+    });
+  }
+
+  /**
+   * Mostly for internal use, you probably want to use `toBlob` or `toDocxJsDocument` instead.
+   */
+  public async transformBlocks(
+    blocks: Block<B, I, S>[],
+    nestingLevel = 0
+  ): Promise<Array<Paragraph | Table>> {
+    const ret: Array<Paragraph | Table> = [];
+
+    for (const b of blocks) {
+      let children = await this.transformBlocks(b.children, nestingLevel + 1);
+      children = children.map((c, _i) => {
+        // NOTE: nested tables not supported (we can't insert the new Tab before a table)
+        if (
+          c instanceof Paragraph &&
+          !(c as any).properties.numberingReferences.length
+        ) {
+          c.addRunToFront(
+            new TextRun({
+              children: [new Tab()],
+            })
+          );
+        }
+        return c;
+      });
+      const self = await this.mapBlock(b as any, nestingLevel, 0 /*unused*/); // TODO: any
+      if (Array.isArray(self)) {
+        ret.push(...self, ...children);
+      } else {
+        ret.push(self, ...children);
+      }
+    }
+    return ret;
+  }
+
+  protected async getFonts(): Promise<DocumentOptions["fonts"]> {
+    // Unfortunately, loading the variable font doesn't work
+    // "./src/fonts/Inter-VariableFont_opsz,wght.ttf",
+
+    let font = await loadFileBuffer(
+      await import("@shared/assets/fonts/inter/Inter_18pt-Regular.ttf")
+    );
+
+    if (font instanceof ArrayBuffer) {
+      // conversionw with Polyfill needed because docxjs requires Buffer
+      const Buffer = (await import("buffer")).Buffer;
+      font = Buffer.from(font);
+    }
+
+    return [{ name: "Inter", data: font as Buffer }];
+  }
+
+  protected async createDefaultDocumentOptions(): Promise<DocumentOptions> {
+    const externalStyles = (await import("./template/word/styles.xml?raw"))
+      .default;
+
+    const bullets = ["•"]; //, "◦", "▪"]; (these don't look great, just use solid bullet for now)
+    return {
+      numbering: {
+        config: [
+          {
+            reference: "blocknote-numbered-list",
+            levels: Array.from({ length: 9 }, (_, i) => ({
+              start: 1,
+              level: i,
+              format: LevelFormat.DECIMAL,
+              text: `%${i + 1}.`,
+              alignment: AlignmentType.LEFT,
+              style: {
+                paragraph: {
+                  indent: {
+                    left: DEFAULT_TAB_STOP * (i + 1),
+                    hanging: DEFAULT_TAB_STOP,
+                  },
+                },
+              },
+            })),
+          },
+          {
+            reference: "blocknote-bullet-list",
+            levels: Array.from({ length: 9 }, (_, i) => ({
+              start: 1,
+              level: i,
+              format: LevelFormat.BULLET,
+              text: bullets[i % bullets.length],
+              alignment: AlignmentType.LEFT,
+              style: {
+                paragraph: {
+                  indent: {
+                    left: DEFAULT_TAB_STOP * (i + 1),
+                    hanging: DEFAULT_TAB_STOP,
+                  },
+                },
+              },
+            })),
+          },
+        ],
+      },
+      fonts: await this.getFonts(),
+      defaultTabStop: 200,
+      externalStyles,
+    };
+  }
+
+  /**
+   * Convert a document (array of Blocks to a Blob representing a .docx file)
+   */
+  public async toBlob(
+    blocks: Block<B, I, S>[],
+    options: {
+      sectionOptions: Omit<ISectionOptions, "children">;
+      documentOptions: DocumentOptions;
+    } = {
+      sectionOptions: {},
+      documentOptions: {},
+    }
+  ) {
+    const doc = await this.toDocxJsDocument(blocks, options);
+    const prevBuffer = globalThis.Buffer;
+    try {
+      if (!globalThis.Buffer) {
+        // load Buffer polyfill because docxjs requires this
+        globalThis.Buffer = (await import("buffer")).Buffer;
+      }
+      return Packer.toBlob(doc);
+    } finally {
+      globalThis.Buffer = prevBuffer;
+    }
+  }
+
+  /**
+   * Convert a document (array of Blocks to a docxjs Document)
+   */
+  public async toDocxJsDocument(
+    blocks: Block<B, I, S>[],
+    options: {
+      sectionOptions: Omit<ISectionOptions, "children">;
+      documentOptions: DocumentOptions;
+    } = {
+      sectionOptions: {},
+      documentOptions: {},
+    }
+  ) {
+    const doc = new Document({
+      ...(await this.createDefaultDocumentOptions()),
+      ...options.documentOptions,
+      sections: [
+        {
+          children: await this.transformBlocks(blocks),
+          ...options.sectionOptions,
+        },
+      ],
+    });
+
+    // fix https://github.com/dolanmiu/docx/pull/2800/files
+    doc.Document.Relationships.createRelationship(
+      doc.Document.Relationships.RelationshipCount + 1,
+      "http://schemas.openxmlformats.org/officeDocument/2006/relationships/fontTable",
+      "fontTable.xml"
+    );
+
+    return doc;
+  }
+}

package/src/docx/imageUtil.ts

@@ -0,0 +1,21 @@
+import type Sharp from "sharp";
+
+export async function getImageDimensions(blob: Blob) {
+  if (typeof window !== "undefined" && import.meta.env.NODE_ENV !== "test") {
+    const bmp = await createImageBitmap(blob);
+    const { width, height } = bmp;
+    bmp.close(); // free memory
+    return { width, height };
+  } else {
+    // node or vitest
+    const sharp = (await require("sharp")) as typeof Sharp;
+    const buffer = await blob.arrayBuffer();
+
+    // const buffer2 = Buffer.from(buffer); for jsdom, currently disabled
+    const metadata = await sharp(buffer).metadata();
+    if (!metadata.width || !metadata.height) {
+      throw new Error("Image has no width or height");
+    }
+    return { width: metadata.width, height: metadata.height };
+  }
+}

package/src/docx/index.ts

@@ -0,0 +1,2 @@
+export * from "./defaultSchema/index.js";
+export * from "./docxExporter.js";

package/src/docx/template/[Content_Types].xml

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types">
+    <Default Extension="jpeg" ContentType="image/jpeg" />
+    <Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml" />
+    <Default Extension="xml" ContentType="application/xml" />
+    <Override PartName="/word/document.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.document.main+xml" />
+    <Override PartName="/word/styles.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.styles+xml" />
+    <Override PartName="/word/settings.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.settings+xml" />
+    <Override PartName="/word/webSettings.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.webSettings+xml" />
+    <Override PartName="/word/fontTable.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.fontTable+xml" />
+    <Override PartName="/word/theme/theme1.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.theme+xml" />
+    <Override PartName="/docProps/core.xml"
+        ContentType="application/vnd.openxmlformats-package.core-properties+xml" />
+    <Override PartName="/docProps/app.xml"
+        ContentType="application/vnd.openxmlformats-officedocument.extended-properties+xml" />
+</Types>

package/src/docx/template/_rels/.rels

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships"><Relationship Id="rId3" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/extended-properties" Target="docProps/app.xml"/><Relationship Id="rId2" Type="http://schemas.openxmlformats.org/package/2006/relationships/metadata/core-properties" Target="docProps/core.xml"/><Relationship Id="rId1" Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument" Target="word/document.xml"/></Relationships>

package/src/docx/template/docProps/app.xml

@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Properties xmlns="http://schemas.openxmlformats.org/officeDocument/2006/extended-properties"
+    xmlns:vt="http://schemas.openxmlformats.org/officeDocument/2006/docPropsVTypes">
+    <Template>Normal.dotm</Template>
+    <TotalTime>23</TotalTime>
+    <Pages>1</Pages>
+    <Words>37</Words>
+    <Characters>216</Characters>
+    <Application>Microsoft Office Word</Application>
+    <DocSecurity>0</DocSecurity>
+    <Lines>1</Lines>
+    <Paragraphs>1</Paragraphs>
+    <ScaleCrop>false</ScaleCrop>
+    <HeadingPairs>
+        <vt:vector size="2" baseType="variant">
+            <vt:variant>
+                <vt:lpstr>Title</vt:lpstr>
+            </vt:variant>
+            <vt:variant>
+                <vt:i4>1</vt:i4>
+            </vt:variant>
+        </vt:vector>
+    </HeadingPairs>
+    <TitlesOfParts>
+        <vt:vector size="1" baseType="lpstr">
+            <vt:lpstr></vt:lpstr>
+        </vt:vector>
+    </TitlesOfParts>
+    <Company></Company>
+    <LinksUpToDate>false</LinksUpToDate>
+    <CharactersWithSpaces>252</CharactersWithSpaces>
+    <SharedDoc>false</SharedDoc>
+    <HyperlinksChanged>false</HyperlinksChanged>
+    <AppVersion>16.0000</AppVersion>
+</Properties>

package/src/docx/template/docProps/core.xml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<cp:coreProperties
+    xmlns:cp="http://schemas.openxmlformats.org/package/2006/metadata/core-properties"
+    xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:dcterms="http://purl.org/dc/terms/"
+    xmlns:dcmitype="http://purl.org/dc/dcmitype/"
+    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
+    <dc:title></dc:title>
+    <dc:subject></dc:subject>
+    <dc:creator>BlockNote</dc:creator>
+    <cp:keywords></cp:keywords>
+    <dc:description></dc:description>
+    <cp:lastModifiedBy>BlockNote</cp:lastModifiedBy>
+    <cp:revision>3</cp:revision>
+    <dcterms:created xsi:type="dcterms:W3CDTF">2024-10-19T14:19:00Z</dcterms:created>
+    <dcterms:modified xsi:type="dcterms:W3CDTF">2024-11-01T04:50:00Z</dcterms:modified>
+</cp:coreProperties>

package/src/docx/template/word/_rels/document.xml.rels

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships">
+    <Relationship Id="rId3"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/webSettings"
+        Target="webSettings.xml" />
+    <Relationship Id="rId7"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/theme"
+        Target="theme/theme1.xml" />
+    <Relationship Id="rId2"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/settings"
+        Target="settings.xml" />
+    <Relationship Id="rId1"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/styles"
+        Target="styles.xml" />
+    <Relationship Id="rId6"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/fontTable"
+        Target="fontTable.xml" />
+    <Relationship Id="rId5"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/image"
+        Target="media/image1.jpeg" />
+    <Relationship Id="rId4"
+        Type="http://schemas.openxmlformats.org/officeDocument/2006/relationships/hyperlink"
+        Target="https://www.blocknotejs.org/" TargetMode="External" />
+</Relationships>