Tables do not display correctly when they have spaces at the beginning (remark-gfm)

[Xing97]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

react-markdown 9.0.1 & remark-gfm 4.0.0

Link to runnable example

No response

Steps to reproduce

Runtime: Node v20

This input:

Value | Type
----: | --------
    0 | fighting
    1 | flying
    2 | poison
    3 | ground
    4 | rock
    5 | bug
    6 | ghost
    7 | steel
    8 | fire
    9 | water
   10 | grass
   11 | electric
   12 | psychic
   13 | ice
   14 | dragon
   15 | dark

It seems that the problem is because of the leading spaces in the rows. If they are removed, it displays correctly. Is the table formatted wrong or is it a defect of react-markdown with remark-gfm?

Expected behavior

Actual behavior

Runtime

Other (please specify in steps to reproduce)

Package manager

pnpm

OS

Windows

Build and bundle tools

Vite

[ChristianMurphy]

Welcome @Xing97! 👋
Sorry you ran into some confusion.
That is not how tables work.
The rules of tables as defined by GFM are noted here: https://github.github.com/gfm/#tables-extension-
In particular you are running into a conflict with indented code blocks https://github.github.com/gfm/#indented-code-blocks

Consider adding pipe symbols around the table to resolve the conflict.

---

For future reference: You can see the behavior is the same on GitHub itself below.

---

Value	Type

0 | fighting
1 | flying
2 | poison
3 | ground
4 | rock
5 | bug
6 | ghost
7 | steel
8 | fire
9 | water

10 | grass
11 | electric
12 | psychic
13 | ice
14 | dragon
15 | dark