Skip to content

Commit

Permalink
Deprecate the className prop
Browse files Browse the repository at this point in the history
Users should wrap the `<Markdown>` component inside a `<div>` manually
instead.

Closes #781
  • Loading branch information
remcohaszing committed Nov 15, 2023
1 parent a27d335 commit ea2fa56
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 4 deletions.
17 changes: 17 additions & 0 deletions changelog.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,23 @@

All notable changes will be documented in this file.

## 9.0.1

### Deprecate `className`

The `className` prop was deprecated.
Not only does the `className` prop add the `className` prop, it also implies a
wrapper `<div>` will be created.
Instead, you should wrap the content in a `<div>` manually.

```jsx
<div className={className}>
<Markdown>
{children}
</Markdown>
</div>
```

## 9.0.0 - 2023-09-27

* [`b67d714`](https://github.com/remarkjs/react-markdown/commit/b67d714)
Expand Down
5 changes: 3 additions & 2 deletions lib/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,7 @@ const deprecations = [
id: 'replace-allownode-allowedtypes-and-disallowedtypes',
to: 'allowedElements'
},
{from: 'className', id: 'deprecate-classname'},
{
from: 'disallowedTypes',
id: 'replace-allownode-allowedtypes-and-disallowedtypes',
Expand Down Expand Up @@ -266,8 +267,8 @@ export function Markdown(options) {
let remove = allowedElements
? !allowedElements.includes(node.tagName)
: disallowedElements
? disallowedElements.includes(node.tagName)
: false
? disallowedElements.includes(node.tagName)
: false

if (!remove && allowElement && typeof index === 'number') {
remove = !allowElement(node, index, parent)
Expand Down
2 changes: 0 additions & 2 deletions readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -256,8 +256,6 @@ Configuration (TypeScript type).
cannot combine w/ `disallowedElements`
* `children` (`string`, optional)
— markdown
* `className` (`string`, optional)
— wrap in a `div` with this class name
* `components` ([`Components`][api-components], optional)
— map tag names to components
* `disallowedElements` (`Array<string>`, default: `[]`)
Expand Down

0 comments on commit ea2fa56

Please sign in to comment.