Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

react-markdown

Package Overview
Dependencies
Maintainers
2
Versions
92
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-markdown - npm Package Compare versions

Comparing version 6.0.3 to 7.0.0

index.d.ts
index.js
lib/ast-to-react.d.ts
lib/ast-to-react.js
lib/react-markdown.d.ts
lib/react-markdown.js
lib/rehype-filter.d.ts
lib/rehype-filter.js
lib/uri-transformer.d.ts
lib/uri-transformer.js

115

package.json
{
"name": "react-markdown",
"version": "6.0.3",
"version": "7.0.0",
"description": "Render Markdown as React components",

@@ -70,7 +70,11 @@ "license": "MIT",

],
"types": "src/react-markdown.d.ts",
"main": "src/react-markdown.js",
"sideEffects": false,
"type": "module",
"main": "index.js",
"types": "index.d.ts",
"unpkg": "react-markdown.min.js",
"files": [
"src/",
"lib/",
"index.d.ts",
"index.js",
"react-markdown.min.js"

@@ -80,14 +84,14 @@ ],

"@types/hast": "^2.0.0",
"@types/unist": "^2.0.3",
"comma-separated-tokens": "^1.0.0",
"prop-types": "^15.7.2",
"property-information": "^5.3.0",
"@types/unist": "^2.0.0",
"comma-separated-tokens": "^2.0.0",
"prop-types": "^15.0.0",
"property-information": "^6.0.0",
"react-is": "^17.0.0",
"remark-parse": "^9.0.0",
"remark-rehype": "^8.0.0",
"space-separated-tokens": "^1.1.0",
"remark-parse": "^10.0.0",
"remark-rehype": "^9.0.0",
"space-separated-tokens": "^2.0.0",
"style-to-object": "^0.3.0",
"unified": "^9.0.0",
"unist-util-visit": "^2.0.0",
"vfile": "^4.0.0"
"unified": "^10.0.0",
"unist-util-visit": "^4.0.0",
"vfile": "^5.0.0"
},

@@ -99,17 +103,7 @@ "peerDependencies": {

"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@matejmazur/react-katex": "^3.0.0",
"@rollup/plugin-babel": "^5.0.0",
"@rollup/plugin-commonjs": "^19.0.0",
"@rollup/plugin-json": "^4.0.0",
"@rollup/plugin-node-resolve": "^13.0.0",
"@testing-library/react": "^12.0.0",
"@types/jest": "^26.0.0",
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0",
"@types/react-is": "^17.0.0",
"@types/react-test-renderer": "^17.0.0",
"babel-plugin-transform-react-remove-prop-types": "^0.4.24",
"c8": "^7.0.0",
"esbuild": "^0.12.0",
"eslint-config-xo-react": "^0.25.0",

@@ -120,35 +114,24 @@ "eslint-plugin-es": "^4.0.0",

"eslint-plugin-security": "^1.0.0",
"jest": "^27.0.0",
"katex": "^0.13.0",
"npm-run-all": "^4.0.0",
"prettier": "^2.0.0",
"react": "^17.0.0",
"react-dom": "^17.0.0",
"react-test-renderer": "^17.0.0",
"rehype-raw": "^5.0.0",
"remark-cli": "^9.0.0",
"remark-gfm": "^1.0.0",
"remark-math": "^4.0.0",
"remark-preset-wooorm": "^8.0.0",
"remark-toc": "^7.0.0",
"rehype-raw": "^6.0.0",
"remark-cli": "^10.0.0",
"remark-gfm": "^2.0.0",
"remark-preset-wooorm": "^9.0.0",
"remark-toc": "^8.0.0",
"rimraf": "^3.0.0",
"rollup": "^2.0.0",
"rollup-plugin-node-polyfills": "^0.2.0",
"rollup-plugin-terser": "^7.0.0",
"type-coverage": "^2.0.0",
"typescript": "^4.0.0",
"uglify-js": "^3.0.0",
"xo": "^0.38.0"
"uvu": "^0.5.0",
"xo": "^0.44.0"
},
"scripts": {
"prepack": "npm run build && npm run format",
"build:ts": "rimraf \"{src/**,test/**,}.d.ts\" && tsc && type-coverage",
"build:umd": "rollup --silent -c",
"build:umdcheck": "printf 'ES5? ' && uglifyjs react-markdown.min.js > /dev/null && echo 'Yes'",
"build": "run-s build:*",
"build": "rimraf \"{lib/**/**,test/**,script/**,}*.d.ts\" && tsc && type-coverage && esbuild index.js --bundle --minify --target=es2015 --outfile=react-markdown.min.js --global-name=ReactMarkdown --banner:js=\"(function (g, f) {typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = f() : typeof define === 'function' && define.amd ? define([], f) : (g = typeof globalThis !== 'undefined' ? globalThis : g || self, g.ReactMarkdown = f()); }(this, (function () { 'use strict';\" --footer:js=\"return ReactMarkdown;})));\"",
"format": "remark . -qfo --ignore-pattern test/ && prettier . -w --loglevel warn && xo --fix",
"test": "run-s build format test:*",
"test:unit": "jest --coverage"
"test-api": "node --no-warnings --experimental-loader=./test/loader.js ./node_modules/.bin/uvu test \"\\.jsx$\"",
"test-coverage": "c8 --check-coverage --branches 100 --functions 100 --lines 100 --statements 100 --reporter lcov npm run test-api",
"test": "npm run build && npm run format && npm run test-coverage"
},
"browserslist": "> 0.25%, not dead",
"remarkConfig": {

@@ -173,13 +156,2 @@ "plugins": [

},
"jest": {
"testEnvironment": "jsdom",
"coverageThreshold": {
"global": {
"branches": 100,
"functions": 100,
"lines": 100,
"statements": 100
}
}
},
"typeCoverage": {

@@ -192,3 +164,4 @@ "atLeast": 100,

"ignoreFiles": [
"src/react-markdown.d.ts"
"lib/react-markdown.d.ts",
"index.d.ts"
]

@@ -206,3 +179,2 @@ },

"prettier": true,
"esnext": false,
"extends": "xo-react",

@@ -215,28 +187,21 @@ "envs": [

"files": [
"src/**/*.js"
"lib/**/*.js"
],
"extends": [
"plugin:es/restrict-to-es2015",
"plugin:es/restrict-to-es2019",
"plugin:security/recommended"
],
"rules": {
"capitalized-comments": "off",
"complexity": "off",
"security/detect-object-injection": "off",
"unicorn/prefer-number-properties": "off",
"unicorn/prefer-optional-catch-binding": "off"
"security/detect-object-injection": "off"
}
},
{
"envs": [
"jest"
],
"files": [
"test/**/*.js"
"test/**/*.jsx"
],
"rules": {
"react/no-children-prop": 0,
"react/display-name": 0,
"no-nested-ternary": 0,
"react/prop-types": 0
"node/file-extension-in-import": "off",
"react/no-children-prop": "off",
"react/prop-types": "off"
}

@@ -243,0 +208,0 @@ }

103

readme.md

@@ -17,2 +17,5 @@ # react-markdown

This package is [ESM only](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c):
Node 12+ is needed to use it and it must be `import`ed instead of `require`d.
[npm][]:

@@ -41,5 +44,5 @@

import ReactMarkdown from 'react-markdown'
import {render} from 'react-dom'
import ReactDom from 'react-dom'
render(<ReactMarkdown># Hello, *world*!</ReactMarkdown>, document.body)
ReactDom.render(<ReactMarkdown># Hello, *world*!</ReactMarkdown>, document.body)
```

@@ -58,3 +61,3 @@

Here is an example using `require`s, passing the markdown as a string, and how
Here is an example that shows passing the markdown as a string and how
to use a plugin ([`remark-gfm`][gfm], which adds support for strikethrough,

@@ -64,10 +67,13 @@ tables, tasklists and URLs directly):

```jsx
const React = require('react')
const ReactMarkdown = require('react-markdown')
const render = require('react-dom').render
const gfm = require('remark-gfm')
import React from 'react'
import ReactDom from 'react-dom'
import ReactMarkdown from 'react-markdown'
import remarkGfm from 'remark-gfm'
const markdown = `Just a link: https://reactjs.com.`
render(<ReactMarkdown remarkPlugins={[gfm]} children={markdown} />, document.body)
ReactDom.render(
<ReactMarkdown children={markdown} remarkPlugins={[remarkGfm]} />,
document.body
)
```

@@ -88,2 +94,5 @@

This package exports the following identifier: `uriTransformer`.
The default export is `ReactMarkdown`.
### `props`

@@ -126,3 +135,3 @@

The default allows only `http`, `https`, `mailto`, and `tel`, and is
available at `ReactMarkdown.uriTransformer`.
exported from this module as `uriTransformer`.
Pass `null` to allow all URLs.

@@ -153,4 +162,4 @@ See [security][]

import ReactMarkdown from 'react-markdown'
import {render} from 'react-dom'
import gfm from 'remark-gfm'
import ReactDom from 'react-dom'
import remarkGfm from 'remark-gfm'

@@ -171,3 +180,6 @@ const markdown = `A paragraph with *emphasis* and **strong importance**.

render(<ReactMarkdown remarkPlugins={[gfm]} children={markdown} />, document.body)
ReactDom.render(
<ReactMarkdown children={markdown} remarkPlugins={[remarkGfm]} />,
document.body
)
```

@@ -222,7 +234,7 @@

import ReactMarkdown from 'react-markdown'
import {render} from 'react-dom'
import gfm from 'remark-gfm'
import ReactDom from 'react-dom'
import remarkGfm from 'remark-gfm'
render(
<ReactMarkdown remarkPlugins={[[gfm, {singleTilde: false}]]}>
ReactDom.render(
<ReactMarkdown remarkPlugins={[[remarkGfm, {singleTilde: false}]]}>
This ~is not~ strikethrough, but ~~this is~~!

@@ -255,21 +267,7 @@ </ReactMarkdown>,

import React from 'react'
import ReactDom from 'react-dom'
import ReactMarkdown from 'react-markdown'
import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter'
/* Use `…/dist/cjs/…` if you’re not in ESM! */
import {dark} from 'react-syntax-highlighter/dist/esm/styles/prism'
import {render} from 'react-dom'
const components = {
code({node, inline, className, children, ...props}) {
const match = /language-(\w+)/.exec(className || '')
return !inline && match ? (
<SyntaxHighlighter style={dark} language={match[1]} PreTag="div" children={String(children).replace(/\n$/, '')} {...props} />
) : (
<code className={className} {...props}>
{children}
</code>
)
}
}
// Did you know you can use tildes instead of backticks for code in markdown? ✨

@@ -283,3 +281,26 @@ const markdown = `Here is some JavaScript code:

render(<ReactMarkdown components={components} children={markdown} />, document.body)
ReactDom.render(
<ReactMarkdown
children={markdown}
components={{
code({node, inline, className, children, ...props}) {
const match = /language-(\w+)/.exec(className || '')
return !inline && match ? (
<SyntaxHighlighter
children={String(children).replace(/\n$/, '')}
style={dark}
language={match[1]}
PreTag="div"
{...props}
/>
) : (
<code className={className} {...props}>
{children}
</code>
)
}
}}
/>,
document.body
)
```

@@ -309,13 +330,14 @@

import React from 'react'
import {render} from 'react-dom'
import ReactDom from 'react-dom'
import ReactMarkdown from 'react-markdown'
import remarkMath from 'remark-math'
import rehypeKatex from 'rehype-katex'
import 'katex/dist/katex.min.css' // `rehype-katex` does not import the CSS for you
render(
ReactDom.render(
<ReactMarkdown
children={`The lift coefficient ($C_L$) is a dimensionless coefficient.`}
remarkPlugins={[remarkMath]}
rehypePlugins={[rehypeKatex]}
children={`The lift coefficient ($C_L$) is a dimensionless coefficient.`}
/>,

@@ -389,5 +411,5 @@ document.body

import React from 'react'
import ReactDom from 'react-dom'
import ReactMarkdown from 'react-markdown'
import rehypeRaw from 'rehype-raw'
import {render} from 'react-dom'

@@ -400,3 +422,6 @@ const input = `<div class="note">

render(<ReactMarkdown rehypePlugins={[rehypeRaw]} children={input} />, document.body)
ReactDom.render(
<ReactMarkdown rehypePlugins={[rehypeRaw]} children={input} />,
document.body
)
```

@@ -425,3 +450,3 @@

```js
<Markdown
<ReactMarkdown
components={{

@@ -608,3 +633,3 @@ // Map `h1` (`# heading`) to use `h2`s.

[uri]: https://github.com/remarkjs/react-markdown/blob/main/src/uri-transformer.js
[uri]: https://github.com/remarkjs/react-markdown/blob/main/lib/uri-transformer.js

@@ -611,0 +636,0 @@ [security]: #security

src/ast-to-react.d.ts
src/ast-to-react.js
src/react-markdown.d.ts
src/react-markdown.js
src/rehype-filter.d.ts
src/rehype-filter.js
src/uri-transformer.d.ts
src/uri-transformer.js
react-markdown.min.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc