Parsing as className instead of class for React

[ramon-san]

First of all I'm sorry to open an issue in your GitHub repository! I really appreciate the tool you created and thank you for the work.

Main question

I was wondering if there is a way to parse markdown with this tool and give the attribute className instead of the regular class when using a comment like:

Some paragraph of my markdown file...
<!--rehype:className=regularText-->

The problem with this is that if I render things as .use(rehypeAttr, { properties: 'attr' }), this gives a translation that adds class to the resulting <p> instead of className. I'm asking this in the hope that something already exists, but if not I'd be happy to collaborate on some code for the implementation.

Another question

I was using ChatGPT to help me fix this, and it suggested a syntax similar to this:

.use(rehypeAttr, {
      p: { className: 'text-gray-700 my-10' },
      h1: { className: 'text-3xl font-bold' },
})

Is this valid? Because when I try to use it nothing happens.

[jaywcjlove]

@ramon-san I think it would be better to design the API as follows:

.use(rehypeAttrs, {
  properties: 'attr',
  elements: {
    p: { className: 'text-gray-700 my-10' },
    h1: { className: 'text-3xl font-bold' },
  }
})