React block renderer

How can I create an id for heading blocks in react-block-renderer?

I need to create the Table of Contents for the blog post. Click on the link and go to part of the page.
I can create them using the BlocksContent array but not inside the blocks prop.

  <BlocksRenderer
    // content={data?.blogs?.data[0]?.attributes?.content as BlocksContent}
    blocks={{ /** I don't know how to do it here */
      heading: ({ children }) => (
        <h2 id={createAnchor(/** node to build the id */)}>{children}</h2>
      ),
    }}
  />

please help

This topic has been created from a Discord post (1245932871626129478) to give it more visibility.
It will be on Read-Only mode here.
Join the conversation on Discord