remark-react - npm Package Compare versions

Comparing version 5.0.1 to 6.0.0

index.js

@@ -23,2 +23,4 @@ 'use strict'
 
+var tableElements = ['table', 'thead', 'tbody', 'tfoot', 'tr']
+
 function react(options) {
@@ -38,2 +40,14 @@ var settings = options || {}
   function h(name, props, children) {
+    // Currently, a warning is triggered by react for *any* white space in
+    // tables.
+    // So we remove the pretty lines for now.
+    // See: <https://github.com/facebook/react/pull/7081>.
+    // See: <https://github.com/facebook/react/pull/7515>.
+    // See: <https://github.com/remarkjs/remark-react/issues/64>.
+    if (children && tableElements.indexOf(name) !== -1) {
+      children = children.filter(function(child) {
+        return child !== '\n'
+      })
+    }
+
     return createElement(
@@ -40,0 +54,0 @@ own.call(components, name) ? components[name] : name,

package.json

 {
   "name": "remark-react",
-  "version": "5.0.1",
-  "description": "Compile Markdown to React with remark",
+  "version": "6.0.0",
+  "description": "remark plugin to transform to React",
   "license": "MIT",
   "keywords": [
+    "unified",
+    "remark",
+    "plugin",
+    "mdast",
+    "markdown",
     "compile",
     "html",
-    "markdown",
-    "remark",
     "stringify"
@@ -17,9 +20,16 @@ ],
   "contributors": [
+    "Titus Wormer <[e-mail]> (https://wooorm.com)",
     "Tom MacWright <[e-mail]>",
-    "Titus Wormer <[e-mail]> (https://wooorm.com)",
+    "David Clark <[e-mail]>",
+    "Linda_pp <[e-mail]>",
+    "Juho Vepsalainen <[e-mail]>",
     "Ciaran Wood <[e-mail]>",
-    "Juho Vepsalainen <[e-mail]>",
+    "Tsuyusato Kitsune <[e-mail]>",
     "Jason Trill <[e-mail]>",
-    "Tsuyusato Kitsune <[e-mail]>",
-    "Jeremy Stucki <[e-mail]>"
+    "Jeremy Stucki <[e-mail]>",
+    "stefanprobst <[e-mail]>",
+    "Mehdi Lahlou <[e-mail]>",
+    "Takuya Matsuyama <[e-mail]>",
+    "Ekongi Yancy <[e-mail]>",
+    "Artem Sapegin <[e-mail]>"
   ],
@@ -31,18 +41,18 @@ "files": [
     "@mapbox/hast-util-table-cell-style": "^0.1.3",
-    "hast-to-hyperscript": "^6.0.0",
-    "hast-util-sanitize": "^1.0.0",
-    "mdast-util-to-hast": "^4.0.0"
+    "hast-to-hyperscript": "^7.0.0",
+    "hast-util-sanitize": "^2.0.0",
+    "mdast-util-to-hast": "^6.0.0"
   },
   "devDependencies": {
-    "is-hidden": "^1.1.1",
+    "is-hidden": "^1.0.0",
     "not": "^0.1.0",
-    "nyc": "^13.0.0",
-    "prettier": "^1.15.2",
+    "nyc": "^14.0.0",
+    "prettier": "^1.0.0",
     "remark": "^10.0.0",
     "remark-cli": "^6.0.0",
-    "remark-frontmatter": "^1.3.1",
-    "remark-preset-wooorm": "^4.0.0",
-    "tape": "^4.9.1",
-    "vfile": "^3.0.0",
-    "xo": "^0.23.0"
+    "remark-frontmatter": "^1.0.0",
+    "remark-preset-wooorm": "^5.0.0",
+    "tape": "^4.0.0",
+    "vfile": "^4.0.0",
+    "xo": "^0.24.0"
   },
@@ -49,0 +59,0 @@ "scripts": {

readme.md

@@ -6,36 +6,38 @@ # remark-react
 [![Downloads][downloads-badge]][downloads]
+[![Size][size-badge]][size]
+[![Sponsors][sponsors-badge]][collective]
+[![Backers][backers-badge]][collective]
 [![Chat][chat-badge]][chat]
 
-Transform markdown to React with **[remark][]**, an extensively tested and
-pluggable parser.
+[**remark**][remark] plugin to transform Markdown to React.
 
-**Why?**  Using innerHTML and [dangerouslySetInnerHTML][] in [React][] is a
+**Why?**
+Using `innerHTML` and [`dangerouslySetInnerHTML`][dangerous] in [React][] is a
 common cause of [XSS][] attacks: user input can include script tags and other
 kinds of active content that reaches across domains and harms security.
-**remark-react** builds a DOM in React, using [React.createElement][h]: this
-means that you can display parsed & formatted Markdown content in an
+`remark-react` builds a DOM in React, using [React.createElement][h]: this
+means that you can display parsed and formatted Markdown content in an
 application without using `dangerouslySetInnerHTML`.
 
-## Installation
+> ⚠️ This package essentially packs [`remark-rehype`][remark-rehype] and
+> [`rehype-react`][rehype-react], and although it does support some
+> customisation, it isn’t very pluggable.
+> It’s probably better to use `remark-rehype` and `rehype-react` directly to
+> benefit from the [**rehype**][rehype] ecosystem.
 
+## Install
+
 [npm][]:
 
-```bash
+```sh
 npm install remark-react
 ```
 
-## Table of Contents
+## Use
 
-*   [Usage](#usage)
-*   [API](#api)
-    *   [remark().use(react\[, options\])](#remarkusereact-options)
-*   [Integrations](#integrations)
-*   [License](#license)
-
-## Usage
-
 ```js
 import React from 'react'
 import ReactDOM from 'react-dom'
-import remark from 'remark'
+import unified from 'unified'
+import parse from 'remark-parse'
 import remark2react from 'remark-react'
@@ -58,3 +60,4 @@
           {
-            remark()
+            unified()
+              .use(parse)
               .use(remark2react)
@@ -76,16 +79,15 @@ .processSync(this.state.text).contents
 
-Transform markdown to React.
+Transform Markdown to React.
 
-##### Options
+##### `options`
 
-###### `options.createElement`
+###### `options.toHast`
 
-How to create elements or components (`Function`).
-Default: `require('react').createElement`
+Configure how to transform [**mdast**][mdast] to [**hast**][hast] (`object`,
+default: `{}`).
+Passed to [`mdast-util-to-hast`][to-hast].
+Note that `toHast.allowDangerousHTML` does not work: it’s not possible to
+inject raw HTML with this plugin (as it’s mean to prevent having to use
+`dangerouslySetInnerHTML`).
 
-###### `options.fragment`
-
-Create fragments instead of an outer `<div>` if available (`Function`).
-Default: `require('react').Fragment`
-
 ###### `options.sanitize`
@@ -95,5 +97,6 @@
 Passed to [`hast-util-sanitize`][sanitize].
-The default schema, if none or `true` is passed, adheres to GitHub’s
-sanitation rules.
-Setting this to `false` is just as bad as using `dangerouslySetInnerHTML`.
+The default schema, if none or `true` is passed, adheres to GitHub’s sanitation
+rules.
+Setting this to `false` is just as bad as using
+[`dangerouslySetInnerHTML`][dangerous].
 
@@ -104,6 +107,16 @@ ###### `options.prefix`
 
+###### `options.createElement`
+
+How to create elements or components (`Function`).
+Default: `require('react').createElement`
+
+###### `options.fragment`
+
+Create fragments instead of an outer `<div>` if available (`Function`, default:
+`require('react').Fragment`).
+
 ###### `options.remarkReactComponents`
 
-Override default elements, such as `<a>`, `<p>`, etc by defining an object
-comprised of `element: Component` key-value pairs (`object`, default:
+Override default elements (such as `<a>`, `<p>`, etc) by defining an object
+comprised of `element: Component` key-value pairs (`Object`, default:
 `undefined`).
@@ -113,3 +126,3 @@ For example, to output `<MyLink>` components instead of `<a>`, and
 
-```javascript
+```js
 remarkReactComponents: {
@@ -121,7 +134,2 @@ a: MyLink,
 
-###### `options.toHast`
-
-Configure how to transform [mdast][] to [hast][] (`object`, default: `{}`).
-Passed to [mdast-util-to-hast][to-hast].
-
 ## Integrations
@@ -132,2 +140,12 @@
 
+## Contribute
+
+See [`contributing.md`][contributing] in [`remarkjs/.github`][health] for ways
+to get started.
+See [`support.md`][support] for ways to get help.
+
+This project has a [Code of Conduct][coc].
+By interacting with this repository, organisation, or community you agree to
+abide by its terms.
+
 ## License
@@ -138,4 +156,6 @@
 
-[build-badge]: https://img.shields.io/travis/remarkjs/remark-react.svg
+<!-- Definitions -->
 
+[build-badge]: https://img.shields.io/travis/remarkjs/remark-react/master.svg
+
 [build]: https://travis-ci.org/remarkjs/remark-react
@@ -151,2 +171,12 @@
 
+[size-badge]: https://img.shields.io/bundlephobia/minzip/remark-react.svg
+
+[size]: https://bundlephobia.com/result?p=remark-react
+
+[sponsors-badge]: https://opencollective.com/unified/sponsors/badge.svg
+
+[backers-badge]: https://opencollective.com/unified/backers/badge.svg
+
+[collective]: https://opencollective.com/unified
+
 [chat-badge]: https://img.shields.io/badge/join%20the%20community-on%20spectrum-7b16ff.svg
@@ -158,2 +188,10 @@
 
+[health]: https://github.com/remarkjs/.github
+
+[contributing]: https://github.com/remarkjs/.github/blob/master/contributing.md
+
+[support]: https://github.com/remarkjs/.github/blob/master/support.md
+
+[coc]: https://github.com/remarkjs/.github/blob/master/code-of-conduct.md
+
 [license]: license
@@ -165,2 +203,12 @@
 
+[mapbox]: https://www.mapbox.com
+
+[remark]: https://github.com/remarkjs/remark
+
+[remark-rehype]: https://github.com/remarkjs/remark-rehype
+
+[rehype]: https://github.com/remarkjs/remark
+
+[rehype-react]: https://github.com/rhysd/rehype-react
+
 [mdast]: https://github.com/syntax-tree/mdast
@@ -170,6 +218,2 @@
 
-[remark]: https://github.com/remarkjs/remark
-
-[mapbox]: https://www.mapbox.com
-
 [to-hast]: https://github.com/syntax-tree/mdast-util-to-hast#tohastnode-options
@@ -179,3 +223,3 @@
 
-[dangerouslysetinnerhtml]: https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
+[dangerous]: https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
 
@@ -182,0 +226,0 @@ [xss]: https://en.wikipedia.org/wiki/Cross-site_scripting

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

12041

increased by25.32%

Lines of code

61

increased by24.49%

Number of lines in readme file

219

increased by25.14%

Dependency changes

• + Addedhast-to-hyperscript@7.0.4(transitive)

• + Addedhast-util-sanitize@2.0.3(transitive)

• + Addedmdast-util-to-hast@6.0.2(transitive)

• - Removedhast-to-hyperscript@6.0.0(transitive)

• - Removedhast-util-sanitize@1.3.1(transitive)

• - Removedmdast-util-to-hast@4.0.0(transitive)

• - Removedunist-util-is@2.1.3(transitive)

• Updatedhast-to-hyperscript@^7.0.0

• Updatedhast-util-sanitize@^2.0.0

• Updatedmdast-util-to-hast@^6.0.0