rich-text-from-markdown does not support table headers

[giovanni-caiazzo]

As per title, @contentful/rich-text-from-markdown does not support table headers in markdown. When I have this in markdown:

| Header 1 | Header 2 |
| --- | --- |
| Cell 1-1 | Cell 1-2 |

The tool responds with:

{
  nodeType: "table",
  content: [
    {
      nodeType: "table-row",
      content: [
        {
          nodeType: "table-cell",
          content: [
            {
              nodeType: "paragraph",
              data: {},
              content: [
                { nodeType: "text", value: "Header 1", marks: [], data: {} },
              ],
            },
          ],
          data: {},
        },
        {
          nodeType: "table-cell",
          content: [
            {
              nodeType: "paragraph",
              data: {},
              content: [
                { nodeType: "text", value: "Header 2", marks: [], data: {} },
              ],
            },
          ],
          data: {},
        },
      ],
      data: {},
    },
    {
      nodeType: "table-row",
      content: [
        {
          nodeType: "table-cell",
          content: [
            {
              nodeType: "paragraph",
              data: {},
              content: [
                { nodeType: "text", value: "Cell 1-1", marks: [], data: {} },
              ],
            },
          ],
          data: {},
        },
        {
          nodeType: "table-cell",
          content: [
            {
              nodeType: "paragraph",
              data: {},
              content: [
                { nodeType: "text", value: "Cell 1-2", marks: [], data: {} },
              ],
            },
          ],
          data: {},
        },
      ],
      data: {},
    },
  ],
}

So, it detects the header part of the markdown (which is |---|) and removes it from the rich text, but does not promote the table-cells to table-header-cells.
Is it possible to know when this feature will be available? Contentful itself supports table-header-cell node types, so I don't see why this tool should not use it.
Thank you for your time

[diegoaguilar]

@giovanni-caiazzo did you found a solution or work around for this?

[giovanni-caiazzo]

I removed all the headers and then treated the first row of any table as the header in my react app 😓

[LuudJanssen]

I used this dirty trick to split the header and body row(s):

[BLOCKS.TABLE]: (_node: unknown, children: ReactNode): ReactNode => {
  const [header, ...body] = children as ReactNode[];
  
  return (
    <Table.Root>
      <Table.Header>{header}</Table.Header>
      <Table.Body>{body}</Table.Body>
    </Table.Root>
  );
},

[z0al]

Looks like the underlying package doesn't recognise the notion of table header cells. Here is a quick demo

But since markdown tables syntax enforces headers I think it's safe to assume the first row of a table is a header row.

Would anyone be willing to submit a PR for this?

[LuudJanssen]

@z0al, this is the same for the tables in rich text in Contentful, a syntax we don't control. Should I create a separate issue for that?

[z0al]

this is the same for the tables in rich text in Contentful

What do you mean @LuudJanssen ? can you give an example please?

[LuudJanssen]

Hi @z0al. I'm talking about header rows missing from the entire Contentful ecosystem.

Ideally, both the converter from markdown to rich text, as well as the native rich text format (for the rich text field) in Contentful would produce something like:

nodeType: table
  nodeType: table-header-row <-- doesn't exist
    nodeType: table-header-cell
    nodeType: table-header-cell
  nodeType: table-row
    nodeType: table-cell
    nodeType: table-cell

Again, don't know if I'm in the right place reporting this enhancement.