fix(xl-docx-exporter): improve OOXML interoperability

[StephanMeijer]

Summary

• Move Inter font settings into Normal style and normalize rFonts (ascii/cs/eastAsia/hAnsi)
• Use ECMA-376 shading semantics (w:val="clear" + w:fill) instead of w:color + "solid"
• Emit table cell widths as numeric dxa values (twips) instead of "pt" strings
• Introduce SourceCode, VerbatimChar, and BlockQuote styles and map code/quotes to them

Rationale

This makes the generated DOCX closer to Word’s own output and improves behavior in Word, LibreOffice, and converters like Pandoc and DocSpec.

Diff of output (DOCX)

after.docx
before.docx

Proving interopability: HTML

Using pandoc for converting to HTML:

$ pandoc before.docx -o before.html --standalone --embed-resources
$ pandoc after.docx  -o after.html  --standalone --embed-resources

before.html
after.html

Click here to see diff.

7c7
<   <title>before</title>
---
>   <title>after</title>
280,282c280,283
< <p>const helloWorld = (message) =&gt; {<br />
< console.log(&quot;Hello World&quot;, message);<br />
< };</p>
---
> <pre><code>const helloWorld = (message) =&gt; {
>   console.log(&quot;Hello World&quot;, message);
> };</code></pre>
> <blockquote>
284c285,286
< <p>Some inline code: var x = 123;</p>
---
> </blockquote>
> <p>Some inline code: <code>var x = 123;</code></p>

Proving interopability: Markdown

Using pandoc for converting to Markdown:

$ pandoc before.docx -o before.md
$ pandoc after.docx -o after.md

before.md
after.md

Click here to see diff.

97,99c97,99
< const helloWorld = (message) =\> {\
< console.log(\"Hello World\", message);\
< };
---
>     const helloWorld = (message) => {
>       console.log("Hello World", message);
>     };
101c101
< Lorem Ipsum Dolor Sit Amet I am a BlockQuote.
---
> > Lorem Ipsum Dolor Sit Amet I am a BlockQuote.
103c103
< Some inline code: var x = 123;
---
> Some inline code: `var x = 123;`

Changes

See above.

Impact

Theoretical possibility to potentially break things.

Testing

Automated tests.

Checklist

• Code follows the project's coding standards.
• Unit tests covering the new feature have been added.
• All existing tests pass.

[vercel]

@StephanMeijer is attempting to deploy a commit to the TypeCell Team on Vercel.

A member of the Team first needs to authorize it.

[StephanMeijer]

The shading was never rendered out. In case we do want this shading to be rendered out, let me know so I can add it to the BlockQuote style.

[pkg-pr-new]

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/ariakit@2206

@blocknote/code-block

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/code-block@2206

@blocknote/core

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/core@2206

@blocknote/mantine

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/mantine@2206

@blocknote/react

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/react@2206

@blocknote/server-util

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/server-util@2206

@blocknote/shadcn

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/shadcn@2206

@blocknote/xl-ai

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-ai@2206

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-docx-exporter@2206

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-email-exporter@2206

@blocknote/xl-multi-column

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-multi-column@2206

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-odt-exporter@2206

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-pdf-exporter@2206

commit: 7d9b07a