Skip to content

Better spacing for paragraphs with borders/shades#2554

Closed
johanneswilm wants to merge 1 commit intosuperdoc-dev:mainfrom
johanneswilm:sd-2106-paragraph-shading-doesnt-extend-to-border-with-space-0
Closed

Better spacing for paragraphs with borders/shades#2554
johanneswilm wants to merge 1 commit intosuperdoc-dev:mainfrom
johanneswilm:sd-2106-paragraph-shading-doesnt-extend-to-border-with-space-0

Conversation

@johanneswilm
Copy link
Copy Markdown
Contributor

@johanneswilm johanneswilm commented Mar 25, 2026

Before:

image

After:

image

Microsoft Word 365:

image

Note: Spacing is better, but still not entirely correct. There is still an additional space of 13-14px between paragraphs in SuperDoc that is not present in Microsoft Word 365. Also note how the shading does not expand into the space between border and paragraph on Microsoft Word 365.

shading-border 2.docx

Copy link
Copy Markdown

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 748be8e4c5

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

toLine: slice.toLine,
x: adjustedX,
y: state.cursorY,
y: state.cursorY + borderExpansion.top,
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P1 Badge Account for border expansion when fitting paragraph slices

layoutParagraphBlock now offsets paragraph fragments by borderExpansion.top, but the slice fit still uses state.contentBottom - state.cursorY (text-only space). When a bordered paragraph starts near the page bottom, sliceLines can accept lines that fit only without the new top offset, so the rendered text is pushed below the page’s content area and gets clipped (overflow: hidden on pages). The same mismatch also allows cursorY to advance past contentBottom after placing a “fitting” slice. Reserve top/bottom border expansion before slicing (or include it in the fit checks) so the fragment only takes lines that truly fit.

Useful? React with 👍 / 👎.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@johanneswilm real issue — bordered paragraphs near the page bottom can overflow since the border size isn't subtracted from the available space before fitting lines.

Copy link
Copy Markdown
Contributor

@caiopizzol caiopizzol left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@johanneswilm the approach works — shifting the fragment down makes borders and shading land correctly.

one issue: border space and paragraph spacing are being added together, but Word treats them as overlapping. that's where the extra 13-14px gap comes from. tested and confirmed with a comparison (will add screenshots in a follow-up comment).

minor: sliceLines doesn't account for border space, so bordered paragraphs near the page bottom could overflow slightly. fine as a follow-up.

no code quality issues. tests for the new border logic are missing — a few cases in layout-paragraph.test.ts would be good.

file:
border-test-doc.docx

word:
Captura de Tela 2026-03-27 às 07 11 57
Captura de Tela 2026-03-27 às 07 12 08

superdoc:
Captura de Tela 2026-03-27 às 07 11 36
Captura de Tela 2026-03-27 às 07 11 48

state.page.fragments.push(fragment);
state.cursorY += fragmentHeight;

state.cursorY += fragmentHeight + borderExpansion.top + borderExpansion.bottom;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

border space and paragraph spacing are stacking here — but Word treats them as overlapping. the spec says border space is measured from the text, ignoring paragraph spacing (ECMA-376 §17.3.1.42).

tested with a doc that has borders (space=4) + 10pt spacing: SuperDoc adds ~6px extra per side vs Word. that adds up to the ~13px gap you mentioned in the PR description.

fix direction: make them overlap (use the bigger one) instead of adding both.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @caiopizzol , thanks for the thorough review. I actually read through quite a bit of ECMA-376 as part of this. Really complex issue!

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you, for your work on this!

@caio-pizzol caio-pizzol self-assigned this Mar 27, 2026
@caio-pizzol
Copy link
Copy Markdown
Contributor

@johanneswilm thanks for this! closing in favor of #2586 which uses your commit as the base and fixes the extra gap between paragraphs you noticed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants