Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Prerequisites

• I'm using the latest version of Docusaurus.
• I have tried the npm run clear or yarn clear command.
• I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
• I have tried creating a repro with https://new.docusaurus.io.
• I have read the console error message carefully (if applicable).

Description

The <Heading> component in docusaurus-theme-classic can be given a className prop:

<Heading as="h2" className="something">Hi!</Heading>

However, the component's manual className=clsx(...) prop ignores props.className:

This means any className added in user-land is ignored.

Reproducible demo

https://github.com/typescript-eslint/typescript-eslint/pull/5951/files#diff-3b034ddb6525c7b93f97ced8a696c78c1837f072b9d1e70c46049675e0e09bf4R112-R116

Steps to reproduce

1. Checkout that PR -> yarn -> yarn start
2. Change
   ...
   to ...
3. Observe that the site page does not center the heading text

Expected behavior

The className should be added to the clsx in Heading.

Actual behavior

The className is ignored.

Your environment

• Public source code: https://github.com/typescript-eslint/typescript-eslint
• Public site URL: https://typescript-eslint.io
• Docusaurus version used: 2.2.0, but the code isn't changed in latest main
• Environment name and version (e.g. Chrome 89, Node.js 16.4): Chrome 107, Node 16.18
• Operating system and version (e.g. Ubuntu 20.04.2 LTS): macOS Monterey

Self-service

• I'd be willing to fix this bug myself.