@blocknote/xl-odt-exporter 0.29.1 → 0.30.1

package/dist/webpack-stats.json

@@ -1 +1 @@
-{"builtAt":1744906294307,"assets":[{"name":"blocknote-xl-odt-exporter.umd.cjs","size":698972},{"name":"blocknote-xl-odt-exporter.umd.cjs.map","size":747000}],"chunks":[{"id":"642be88","entry":true,"initial":true,"files":["blocknote-xl-odt-exporter.umd.cjs"],"names":["index"]}],"modules":[{"name":"./src/odt/defaultSchema/blocks.tsx","size":14185,"chunks":["642be88"]},{"name":"./src/odt/defaultSchema/inlineContent.tsx","size":533,"chunks":["642be88"]},{"name":"./src/odt/defaultSchema/styles.ts","size":963,"chunks":["642be88"]},{"name":"./src/odt/defaultSchema/index.ts","size":199,"chunks":["642be88"]},{"name":"../../shared/util/fileUtil.ts","size":214,"chunks":["642be88"]},{"name":"../../shared/util/imageUtil.ts","size":592,"chunks":["642be88"]},{"name":"./src/odt/template/styles.xml?raw","size":76781,"chunks":["642be88"]},{"name":"./src/odt/odtExporter.tsx","size":9974,"chunks":["642be88"]},{"name":"./src/index.ts","size":0,"chunks":["642be88"]},{"name":"../../shared/assets/fonts/inter/Inter_18pt-Regular.ttf","size":456958,"chunks":["642be88"]},{"name":"../../shared/assets/fonts/GeistMono-Regular.ttf","size":155049,"chunks":["642be88"]}]}
+{"builtAt":1747749761795,"assets":[{"name":"blocknote-xl-odt-exporter.umd.cjs","size":698981},{"name":"blocknote-xl-odt-exporter.umd.cjs.map","size":747283}],"chunks":[{"id":"642be88","entry":true,"initial":true,"files":["blocknote-xl-odt-exporter.umd.cjs"],"names":["index"]}],"modules":[{"name":"./src/odt/defaultSchema/blocks.tsx","size":14213,"chunks":["642be88"]},{"name":"./src/odt/defaultSchema/inlineContent.tsx","size":533,"chunks":["642be88"]},{"name":"./src/odt/defaultSchema/styles.ts","size":963,"chunks":["642be88"]},{"name":"./src/odt/defaultSchema/index.ts","size":199,"chunks":["642be88"]},{"name":"../../shared/util/fileUtil.ts","size":214,"chunks":["642be88"]},{"name":"../../shared/util/imageUtil.ts","size":592,"chunks":["642be88"]},{"name":"./src/odt/template/styles.xml?raw","size":76781,"chunks":["642be88"]},{"name":"./src/odt/odtExporter.tsx","size":9974,"chunks":["642be88"]},{"name":"./src/index.ts","size":0,"chunks":["642be88"]},{"name":"../../shared/assets/fonts/inter/Inter_18pt-Regular.ttf","size":456958,"chunks":["642be88"]},{"name":"../../shared/assets/fonts/GeistMono-Regular.ttf","size":155049,"chunks":["642be88"]}]}

package/package.json

@@ -9,7 +9,7 @@
     "directory": "packages/xl-odt-exporter"
   },
   "license": "AGPL-3.0 OR PROPRIETARY",
-  "version": "0.29.1",
+  "version": "0.30.1",
   "files": [
     "dist",
     "types",
@@ -44,11 +44,12 @@
     },
     "./style.css": {
       "import": "./dist/style.css",
-      "require": "./dist/style.css"
+      "require": "./dist/style.css",
+      "style": "./dist/style.css"
     }
   },
   "dependencies": {
-    "@blocknote/core": "0.29.1",
+    "@blocknote/core": "0.30.1",
     "@zip.js/zip.js": "^2.7.57",
     "buffer": "^6.0.3",
     "image-meta": "^0.2.1"
@@ -57,7 +58,6 @@
     "@testing-library/react": "^16.0.1",
     "@types/react": "^18.0.25",
     "@types/react-dom": "^18.0.9",
-    "prettier": "^2.7.1",
     "rollup-plugin-webpack-stats": "^0.2.2",
     "typescript": "^5.0.4",
     "vite": "^5.3.4",

package/src/odt/__snapshots__/basic/content.xml

@@ -313,10 +313,10 @@
                 Open file
             </text:p>
             <text:p text:style-name="Standard">
-                <draw:frame draw:style-name="Frame" style:rel-height="scale" style:rel-width="512px" svg:width="512px" svg:height="532px" text:anchor-type="as-char">
+                <draw:frame draw:style-name="Frame" style:rel-height="scale" style:rel-width="332px" svg:width="332px" svg:height="352px" text:anchor-type="as-char">
                     <draw:text-box>
                         <text:p text:style-name="Caption">
-                            <draw:frame draw:style-name="Frame" style:rel-height="scale" svg:width="512px" svg:height="512px" style:rel-width="100%">
+                            <draw:frame draw:style-name="Frame" style:rel-height="scale" svg:width="332px" svg:height="332px" style:rel-width="100%">
                                 <draw:image xlink:type="simple" xlink:show="embed" xlink:actuate="onLoad" xlink:href="Pictures/picture-0.jpg" draw:mime-type="image/jpeg"></draw:image>
                             </draw:frame>
                             <text:line-break></text:line-break>

package/src/odt/__snapshots__/withCustomOptions/content.xml

@@ -327,10 +327,10 @@
                 Open file
             </text:p>
             <text:p text:style-name="Standard">
-                <draw:frame draw:style-name="Frame" style:rel-height="scale" style:rel-width="512px" svg:width="512px" svg:height="532px" text:anchor-type="as-char">
+                <draw:frame draw:style-name="Frame" style:rel-height="scale" style:rel-width="332px" svg:width="332px" svg:height="352px" text:anchor-type="as-char">
                     <draw:text-box>
                         <text:p text:style-name="Caption">
-                            <draw:frame draw:style-name="Frame" style:rel-height="scale" svg:width="512px" svg:height="512px" style:rel-width="100%">
+                            <draw:frame draw:style-name="Frame" style:rel-height="scale" svg:width="332px" svg:height="332px" style:rel-width="100%">
                                 <draw:image xlink:type="simple" xlink:show="embed" xlink:actuate="onLoad" xlink:href="Pictures/picture-0.jpg" draw:mime-type="image/jpeg"></draw:image>
                             </draw:frame>
                             <text:line-break></text:line-break>

package/src/odt/defaultSchema/blocks.tsx

@@ -19,7 +19,7 @@ const createParagraphStyle = (
   parentStyleName = "Standard",
   styleAttributes: Record<string, string> = {},
   paragraphStyleAttributes: Record<string, string> = {},
-  textStyleAttributes: Record<string, string> = {}
+  textStyleAttributes: Record<string, string> = {},
 ) => {
   const paragraphStyles: Record<string, string> = {
     ...paragraphStyleAttributes,
@@ -70,7 +70,8 @@ const createParagraphStyle = (
       style:family="paragraph"
       style:name={name}
       style:parent-style-name={parentStyleName}
-      {...styleAttributes}>
+      {...styleAttributes}
+    >
       {backgroundColor && (
         <loext:graphic-properties
           draw:fill="solid"
@@ -88,7 +89,7 @@ const createParagraphStyle = (
 };
 
 const createTableCellStyle = (
-  exporter: ODTExporter<any, any, any>
+  exporter: ODTExporter<any, any, any>,
 ): ((cell: TableCell<any, any>) => string) => {
   // To not create a new style for each cell within a table, we cache the styles based on unique cell properties
   const cellStyleCache = new Map<string, string>();
@@ -137,7 +138,7 @@ const createTableCellStyle = (
 };
 const createTableStyle = (
   exporter: ODTExporter<any, any, any>,
-  options: { width: number }
+  options: { width: number },
 ) => {
   const tableStyleName = exporter.registerStyle((name) => (
     <style:style style:family="table" style:name={name}>
@@ -154,7 +155,7 @@ const createTableStyle = (
 
 const wrapWithLists = (
   content: React.ReactNode,
-  level: number
+  level: number,
 ): React.ReactNode => {
   if (level <= 0) {
     return content;
@@ -176,7 +177,7 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
   paragraph: (block, exporter, nestingLevel) => {
     const styleName = createParagraphStyle(
       exporter as ODTExporter<any, any, any>,
-      block.props
+      block.props,
     );
 
     return (
@@ -191,14 +192,15 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
     const customStyleName = createParagraphStyle(
       exporter as ODTExporter<any, any, any>,
       block.props,
-      "Heading_20_" + block.props.level
+      "Heading_20_" + block.props.level,
     );
     const styleName = customStyleName;
 
     return (
       <text:h
         text:outline-level={`${block.props.level}`}
-        text:style-name={styleName}>
+        text:style-name={styleName}
+      >
         {getTabs(nestingLevel)}
         {exporter.transformInlineContent(block.content)}
       </text:h>
@@ -217,7 +219,7 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
       },
       {
         "fo:color": "#7D797A",
-      }
+      },
     );
     const styleName = customStyleName;
 
@@ -244,7 +246,7 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
       exporter as ODTExporter<any, any, any>,
       block.props,
       "Standard",
-      { "style:list-style-name": "WWNum1" }
+      { "style:list-style-name": "WWNum1" },
     );
     return (
       <text:list text:style-name="WWNum1">
@@ -253,7 +255,7 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
             <text:p text:style-name={styleName}>
               {exporter.transformInlineContent(block.content)}
             </text:p>,
-            nestingLevel
+            nestingLevel,
           )}
         </text:list-item>
       </text:list>
@@ -263,7 +265,7 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
   numberedListItem: (block, exporter, nestingLevel, numberedListIndex) => {
     const styleName = createParagraphStyle(
       exporter as ODTExporter<any, any, any>,
-      block.props
+      block.props,
     );
     // continue numbering from the previous list item if this is not the first item
     const continueNumbering = (numberedListIndex || 0) > 1 ? "true" : "false";
@@ -271,16 +273,18 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
     return (
       <text:list
         text:style-name="No_20_List"
-        text:continue-numbering={continueNumbering}>
+        text:continue-numbering={continueNumbering}
+      >
         <text:list-item
           {...(continueNumbering === "false" && {
             "text:start-value": block.props.start,
-          })}>
+          })}
+        >
           {wrapWithLists(
             <text:p text:style-name={styleName}>
               {exporter.transformInlineContent(block.content)}
             </text:p>,
-            nestingLevel
+            nestingLevel,
           )}
         </text:list-item>
       </text:list>
@@ -305,9 +309,9 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
       await odtExporter.registerPicture(block.props.url);
     const styleName = createParagraphStyle(
       exporter as ODTExporter<any, any, any>,
-      block.props
+      block.props,
     );
-    const width = block.props.previewWidth;
+    const width = block.props.previewWidth || originalDimensions.width;
     const height =
       (originalDimensions.height / originalDimensions.width) * width;
     const captionHeight = 20;
@@ -321,7 +325,8 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
           style:rel-width={block.props.caption ? "100%" : `${width}px`}
           {...(!block.props.caption && {
             "text:anchor-type": "as-char",
-          })}>
+          })}
+        >
           <draw:image
             xlink:type="simple"
             xlink:show="embed"
@@ -344,7 +349,8 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
             style:rel-width={`${width}px`}
             svg:width={`${width}px`}
             svg:height={`${height + captionHeight}px`}
-            text:anchor-type="as-char">
+            text:anchor-type="as-char"
+          >
             <draw:text-box>{imageFrame}</draw:text-box>
           </draw:frame>
         </text:p>
@@ -360,7 +366,7 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
       block.content.columnWidths.reduce(
         (totalWidth, colWidth) =>
           (totalWidth || 0) + (colWidth || DEFAULT_COLUMN_WIDTH_PX),
-        0
+        0,
       ) || 0;
     const tableWidthPT = tableWidthPX * 0.75;
     const ex = exporter as ODTExporter<any, any, any>;
@@ -394,7 +400,8 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
                   style:text-align-source="fix"
                   style:paragraph-properties-text-align={
                     cell.props.textAlignment
-                  }>
+                  }
+                >
                   <text:p text:style-name="Standard">
                     {exporter.transformInlineContent(cell.content)}
                   </text:p>
@@ -434,7 +441,8 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
               text:style-name="Internet_20_link"
               office:target-frame-name="_top"
               xlink:show="replace"
-              xlink:href={block.props.url}>
+              xlink:href={block.props.url}
+            >
               <text:span text:style-name="Internet_20_link">
                 Open file
               </text:span>
@@ -458,7 +466,8 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
           text:style-name="Internet_20_link"
           office:target-frame-name="_top"
           xlink:show="replace"
-          xlink:href={block.props.url}>
+          xlink:href={block.props.url}
+        >
           <text:span text:style-name="Internet_20_link">Open video</text:span>
         </text:a>
       </text:p>
@@ -476,7 +485,8 @@ export const odtBlockMappingForDefaultSchema: BlockMapping<
           text:style-name="Internet_20_link"
           office:target-frame-name="_top"
           xlink:show="replace"
-          xlink:href={block.props.url}>
+          xlink:href={block.props.url}
+        >
           <text:span text:style-name="Internet_20_link">Open audio</text:span>
         </text:a>
       </text:p>

package/src/odt/defaultSchema/inlineContent.tsx

@@ -18,7 +18,8 @@ export const odtInlineContentMappingForDefaultSchema: InlineContentMapping<
         text:style-name="Internet_20_link"
         office:target-frame-name="_top"
         xlink:show="replace"
-        xlink:href={ic.href}>
+        xlink:href={ic.href}
+      >
         {content}
       </text:a>
     );

package/src/odt/odtExporter.test.ts

@@ -17,7 +17,7 @@ describe("exporter", () => {
       BlockNoteSchema.create({
         blockSpecs: { ...defaultBlockSpecs, pageBreak: PageBreak },
       }),
-      odtDefaultSchemaMappings
+      odtDefaultSchemaMappings,
     );
     const odt = await exporter.toODTDocument(testDocument);
     await testODTDocumentAgainstSnapshot(odt, {
@@ -34,14 +34,14 @@ describe("exporter", () => {
         BlockNoteSchema.create({
           blockSpecs: { ...defaultBlockSpecs, pageBreak: PageBreak },
         }),
-        odtDefaultSchemaMappings
+        odtDefaultSchemaMappings,
       );
 
       const odt = await exporter.toODTDocument(testDocument, {
         footer: "<text:p>FOOTER</text:p>",
         header: new DOMParser().parseFromString(
           `<text:p xmlns:text="urn:oasis:names:tc:opendocument:xmlns:text:1.0">HEADER</text:p>`,
-          "text/xml"
+          "text/xml",
         ),
       });
 
@@ -49,7 +49,7 @@ describe("exporter", () => {
         styles: "__snapshots__/withCustomOptions/styles.xml",
         content: "__snapshots__/withCustomOptions/content.xml",
       });
-    }
+    },
   );
 });
 
@@ -58,7 +58,7 @@ async function testODTDocumentAgainstSnapshot(
   snapshots: {
     styles: string;
     content: string;
-  }
+  },
 ) {
   const zipReader = new ZipReader(new BlobReader(odt));
   const entries = await zipReader.getEntries();
@@ -72,9 +72,9 @@ async function testODTDocumentAgainstSnapshot(
   expect(stylesXML).toBeDefined();
   expect(contentXML).toBeDefined();
   expect(
-    xmlFormat(await stylesXML!.getData!(stylesXMLWriter))
+    xmlFormat(await stylesXML!.getData!(stylesXMLWriter)),
   ).toMatchFileSnapshot(snapshots.styles);
   expect(
-    xmlFormat(await contentXML!.getData!(contentXMLWriter))
+    xmlFormat(await contentXML!.getData!(contentXMLWriter)),
   ).toMatchFileSnapshot(snapshots.content);
 }

package/src/odt/odtExporter.tsx

@@ -18,7 +18,7 @@ import stylesXml from "./template/styles.xml?raw";
 export class ODTExporter<
   B extends BlockSchema,
   S extends StyleSchema,
-  I extends InlineContentSchema
+  I extends InlineContentSchema,
 > extends Exporter<
   B,
   I,
@@ -59,7 +59,7 @@ export class ODTExporter<
       Record<string, string>,
       React.ReactNode
     >["mappings"],
-    options?: Partial<ExporterOptions>
+    options?: Partial<ExporterOptions>,
   ) {
     const defaults = {
       colors: COLORS_DEFAULT,
@@ -71,10 +71,10 @@ export class ODTExporter<
 
   protected async loadFonts() {
     const interFont = await loadFileBuffer(
-      await import("@shared/assets/fonts/inter/Inter_18pt-Regular.ttf")
+      await import("@shared/assets/fonts/inter/Inter_18pt-Regular.ttf"),
     );
     const geistMonoFont = await loadFileBuffer(
-      await import("@shared/assets/fonts/GeistMono-Regular.ttf")
+      await import("@shared/assets/fonts/GeistMono-Regular.ttf"),
     );
 
     return [
@@ -106,7 +106,7 @@ export class ODTExporter<
       styleName,
       <style:style style:name={styleName} style:family="text">
         <style:text-properties {...styles} />
-      </style:style>
+      </style:style>,
     );
 
     return <text:span text:style-name={styleName}>{styledText.text}</text:span>;
@@ -114,7 +114,7 @@ export class ODTExporter<
 
   public async transformBlocks(
     blocks: Block<B, I, S>[],
-    nestingLevel = 0
+    nestingLevel = 0,
   ): Promise<React.ReactNode[]> {
     const ret: React.ReactNode[] = [];
     let numberedListIndex = 0;
@@ -128,13 +128,13 @@ export class ODTExporter<
 
       const children = await this.transformBlocks(
         block.children,
-        nestingLevel + 1
+        nestingLevel + 1,
       );
 
       const content = await this.mapBlock(
         block as any,
         nestingLevel,
-        numberedListIndex
+        numberedListIndex,
       );
 
       ret.push(content);
@@ -151,7 +151,7 @@ export class ODTExporter<
     options?: {
       header?: string | XMLDocument;
       footer?: string | XMLDocument;
-    }
+    },
   ): Promise<Blob> {
     const xmlOptionToString = (xmlDocument: string | XMLDocument) => {
       const xmlNamespacesRegEx =
@@ -187,20 +187,23 @@ export class ODTExporter<
         xmlns:fo="urn:oasis:names:tc:opendocument:xmlns:xsl-fo-compatible:1.0"
         xmlns:svg="urn:oasis:names:tc:opendocument:xmlns:svg-compatible:1.0"
         xmlns:loext="urn:org:documentfoundation:names:experimental:office:xmlns:loext:1.0"
-        office:version="1.3">
+        office:version="1.3"
+      >
         <office:font-face-decls>
           {fonts.map((font) => {
             return (
               <style:font-face
                 style:name={font.name}
                 svg:font-family={font.name}
-                style:font-pitch="variable">
+                style:font-pitch="variable"
+              >
                 <svg:font-face-src>
                   <svg:font-face-uri
                     xlink:href={`Fonts/${font.fileName}`}
                     xlink:type="simple"
                     loext:font-style="normal"
-                    loext:font-weight="normal">
+                    loext:font-weight="normal"
+                  >
                     <svg:font-face-format svg:string="truetype" />
                   </svg:font-face-uri>
                 </svg:font-face-src>
@@ -214,18 +217,21 @@ export class ODTExporter<
             <style:master-page
               style:name="Standard"
               style:page-layout-name="Mpm1"
-              draw:style-name="Mdp1">
+              draw:style-name="Mdp1"
+            >
               {header && (
                 <style:header
                   dangerouslySetInnerHTML={{
                     __html: header,
-                  }}></style:header>
+                  }}
+                ></style:header>
               )}
               {footer && (
                 <style:footer
                   dangerouslySetInnerHTML={{
                     __html: footer,
-                  }}></style:footer>
+                  }}
+                ></style:footer>
               )}
             </style:master-page>
           </office:master-styles>
@@ -239,7 +245,8 @@ export class ODTExporter<
     const manifestNode = (
       <manifest:manifest
         xmlns:manifest="urn:oasis:names:tc:opendocument:xmlns:manifest:1.0"
-        manifest:version="1.3">
+        manifest:version="1.3"
+      >
         <manifest:file-entry
           manifest:media-type="application/vnd.oasis.opendocument.text"
           manifest:full-path="/"
@@ -271,7 +278,7 @@ export class ODTExporter<
       </manifest:manifest>
     );
     const zipWriter = new ZipWriter(
-      new BlobWriter("application/vnd.oasis.opendocument.text")
+      new BlobWriter("application/vnd.oasis.opendocument.text"),
     );
 
     // Add mimetype first, uncompressed
@@ -283,7 +290,7 @@ export class ODTExporter<
         level: 0,
         dataDescriptor: false,
         extendedTimestamp: false,
-      }
+      },
     );
 
     const contentXml = renderToString(content);
@@ -298,7 +305,7 @@ export class ODTExporter<
     pictures.forEach((picture) => {
       zipWriter.add(
         `Pictures/${picture.fileName}`,
-        new BlobReader(picture.file)
+        new BlobReader(picture.file),
       );
     });
 

package/src/odt/util/jsx.d.ts

@@ -1,4 +1,4 @@
-declare module 'react/jsx-runtime' {
+declare module "react/jsx-runtime" {
   namespace JSX {
     interface IntrinsicElements {
       "office:document-content": any;
@@ -54,4 +54,4 @@ declare module 'react/jsx-runtime' {
       "fo:padding"?: string;
     }
   }
-}
+}

package/types/src/odt/defaultSchema/index.d.ts

@@ -330,7 +330,8 @@ export declare const odtDefaultSchemaMappings: {
                         default: true;
                     };
                     previewWidth: {
-                        default: number;
+                        default: undefined;
+                        type: "number";
                     };
                 };
                 content: "none";
@@ -360,7 +361,8 @@ export declare const odtDefaultSchemaMappings: {
                         default: true;
                     };
                     previewWidth: {
-                        default: number;
+                        default: undefined;
+                        type: "number";
                     };
                 };
                 content: "none";
@@ -392,7 +394,8 @@ export declare const odtDefaultSchemaMappings: {
                         default: true;
                     };
                     previewWidth: {
-                        default: number;
+                        default: undefined;
+                        type: "number";
                     };
                 };
                 content: "none";
@@ -422,7 +425,8 @@ export declare const odtDefaultSchemaMappings: {
                         default: true;
                     };
                     previewWidth: {
-                        default: number;
+                        default: undefined;
+                        type: "number";
                     };
                 };
                 content: "none";