Use ESM

package.json

@@ -15,6 +15,7 @@
     "Marc-Antoine Ouimet <[email protected]>",
     "Rongjian Zhang <[email protected]>"
   ],
+  "type": "module",
   "devDependencies": {
     "c8": "^7.0.0",
     "dtslint": "^4.0.0",

packages/rehype-katex/index.js

@@ -1,18 +1,16 @@
-const visit = require('unist-util-visit')
-const katex = require('katex').renderToString
-const unified = require('unified')
-const parse = require('rehype-parse')
-const toText = require('hast-util-to-text')
-
-module.exports = rehypeKatex
+import visit from 'unist-util-visit'
+import katex from 'katex'
+import unified from 'unified'
+import parse from 'rehype-parse'
+import toText from 'hast-util-to-text'
 
 const assign = Object.assign
 
 const parseHtml = unified().use(parse, {fragment: true, position: false})
 
 const source = 'rehype-katex'
 
-function rehypeKatex(options) {
+export default function rehypeKatex(options) {
   const settings = options || {}
   const throwOnError = settings.throwOnError || false
 
@@ -35,7 +33,7 @@ function rehypeKatex(options) {
       let result
 
       try {
-        result = katex(
+        result = katex.renderToString(
           value,
           assign({}, settings, {displayMode: displayMode, throwOnError: true})
         )
@@ -45,7 +43,7 @@ function rehypeKatex(options) {
 
         file[fn](error.message, element.position, origin)
 
-        result = katex(
+        result = katex.renderToString(
           value,
           assign({}, settings, {
             displayMode: displayMode,

packages/rehype-katex/package.json

@@ -29,12 +29,12 @@
     "Junyoung Choi <[email protected]> (https://rokt33r.github.io)",
     "Titus Wormer <[email protected]> (https://wooorm.com)"
   ],
+  "sideEffects": false,
+  "type": "module",
+  "main": "index.js",
   "files": [
-    "index.js",
-    "types/index.d.ts"
+    "index.js"
   ],
-  "main": "index.js",
-  "types": "types/index.d.ts",
   "dependencies": {
     "@types/katex": "^0.11.0",
     "hast-util-to-text": "^2.0.0",

packages/rehype-katex/test.js

@@ -1,19 +1,19 @@
-const test = require('tape')
-const katex = require('katex')
-const unified = require('unified')
-const parseMarkdown = require('remark-parse')
-const remark2rehype = require('remark-rehype')
-const parseHtml = require('rehype-parse')
-const stringify = require('rehype-stringify')
-const math = require('../remark-math')
-const rehypeKatex = require('.')
+import test from 'tape'
+import katex from 'katex'
+import unified from 'unified'
+import remarkParse from 'remark-parse'
+import remarkRehype from 'remark-rehype'
+import rehypeParse from 'rehype-parse'
+import rehypeStringify from 'rehype-stringify'
+import remarkMath from '../remark-math/index.js'
+import rehypeKatex from './index.js'
 
 test('rehype-katex', function (t) {
   t.deepEqual(
     unified()
-      .use(parseHtml, {fragment: true, position: false})
+      .use(rehypeParse, {fragment: true, position: false})
       .use(rehypeKatex)
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync(
         [
           '<p>Inline math <span class="math-inline">\\alpha</span>.</p>',
@@ -23,8 +23,8 @@ test('rehype-katex', function (t) {
       )
       .toString(),
     unified()
-      .use(parseHtml, {fragment: true, position: false})
-      .use(stringify)
+      .use(rehypeParse, {fragment: true, position: false})
+      .use(rehypeStringify)
       .processSync(
         [
           '<p>Inline math <span class="math-inline">' +
@@ -42,11 +42,11 @@ test('rehype-katex', function (t) {
 
   t.deepEqual(
     unified()
-      .use(parseMarkdown, {position: false})
-      .use(math)
-      .use(remark2rehype)
+      .use(remarkParse, {position: false})
+      .use(remarkMath)
+      .use(remarkRehype)
       .use(rehypeKatex)
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync(
         [
           'Inline math $\\alpha$.',
@@ -60,8 +60,8 @@ test('rehype-katex', function (t) {
       )
       .toString(),
     unified()
-      .use(parseHtml, {fragment: true, position: false})
-      .use(stringify)
+      .use(rehypeParse, {fragment: true, position: false})
+      .use(rehypeStringify)
       .processSync(
         [
           '<p>Inline math <span class="math math-inline">' +
@@ -79,16 +79,16 @@ test('rehype-katex', function (t) {
 
   t.deepEqual(
     unified()
-      .use(parseHtml, {fragment: true, position: false})
+      .use(rehypeParse, {fragment: true, position: false})
       .use(rehypeKatex)
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync(
         '<p>Double math <span class="math-inline math-display">\\alpha</span>.</p>'
       )
       .toString(),
     unified()
-      .use(parseHtml, {fragment: true, position: false})
-      .use(stringify)
+      .use(rehypeParse, {fragment: true, position: false})
+      .use(rehypeStringify)
       .processSync(
         '<p>Double math <span class="math-inline math-display">' +
           katex.renderToString('\\alpha', {displayMode: true}) +
@@ -102,14 +102,14 @@ test('rehype-katex', function (t) {
 
   t.deepEqual(
     unified()
-      .use(parseHtml, {fragment: true, position: false})
+      .use(rehypeParse, {fragment: true, position: false})
       .use(rehypeKatex, {macros: macros})
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync('<span class="math-inline">\\RR</span>')
       .toString(),
     unified()
-      .use(parseHtml, {fragment: true, position: false})
-      .use(stringify)
+      .use(rehypeParse, {fragment: true, position: false})
+      .use(rehypeStringify)
       .processSync(
         '<span class="math-inline">' +
           katex.renderToString('\\RR', {macros: macros}) +
@@ -121,14 +121,14 @@ test('rehype-katex', function (t) {
 
   t.deepEqual(
     unified()
-      .use(parseHtml, {fragment: true, position: false})
+      .use(rehypeParse, {fragment: true, position: false})
       .use(rehypeKatex, {errorColor: 'orange'})
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync('<span class="math-inline">\\alpa</span>')
       .toString(),
     unified()
-      .use(parseHtml, {fragment: true, position: false})
-      .use(stringify)
+      .use(rehypeParse, {fragment: true, position: false})
+      .use(rehypeStringify)
       .processSync(
         '<span class="math-inline">' +
           katex.renderToString('\\alpa', {
@@ -143,9 +143,9 @@ test('rehype-katex', function (t) {
 
   t.deepEqual(
     unified()
-      .use(parseHtml, {fragment: true})
+      .use(rehypeParse, {fragment: true})
       .use(rehypeKatex)
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync(
         '<p>Lorem</p>\n<p><span class="math-inline">\\alpa</span></p>'
       )
@@ -158,9 +158,9 @@ test('rehype-katex', function (t) {
 
   try {
     unified()
-      .use(parseHtml, {fragment: true})
+      .use(rehypeParse, {fragment: true})
       .use(rehypeKatex, {throwOnError: true})
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync(
         '<p>Lorem</p>\n<p><span class="math-inline">\\alpa</span></p>'
       )
@@ -174,14 +174,14 @@ test('rehype-katex', function (t) {
 
   t.deepEqual(
     unified()
-      .use(parseHtml, {fragment: true, position: false})
+      .use(rehypeParse, {fragment: true, position: false})
       .use(rehypeKatex, {errorColor: 'orange', strict: 'ignore'})
-      .use(stringify)
+      .use(rehypeStringify)
       .processSync('<span class="math-inline">ê&amp;</span>')
       .toString(),
     unified()
-      .use(parseHtml, {fragment: true, position: false})
-      .use(stringify)
+      .use(rehypeParse, {fragment: true, position: false})
+      .use(rehypeStringify)
       .processSync(
         '<span class="math-inline"><span class="katex-error" title="ParseError: KaTeX parse error: Expected \'EOF\', got \'&\' at position 2: ê&̲" style="color:orange">ê&amp;</span></span>'
       )

packages/rehype-mathjax/browser.js

@@ -1,11 +1,12 @@
-const createPlugin = require('./lib/core')
+import {createPlugin} from './lib/core.js'
 
-module.exports = createPlugin(
+const rehypeMathJaxBrowser = createPlugin(
   'rehypeMathJaxBrowser',
   renderBrowser,
   false,
   true
 )
+export default rehypeMathJaxBrowser
 
 // To do next major: Make `options` match the format of MathJax options
 // `{tex: ...}`

packages/rehype-mathjax/chtml.js

@@ -1,9 +1,11 @@
-const createInput = require('./lib/input')
-const createOutput = require('./lib/output-chtml')
-const createRenderer = require('./lib/renderer')
-const createPlugin = require('./lib/core')
+import {createInput} from './lib/input.js'
+import {createOutput} from './lib/output-chtml.js'
+import {createRenderer} from './lib/renderer.js'
+import {createPlugin} from './lib/core.js'
 
-module.exports = createPlugin('rehypeMathJaxCHtml', renderCHtml, true)
+const rehypeMathJaxCHtml = createPlugin('rehypeMathJaxCHtml', renderCHtml, true)
+
+export default rehypeMathJaxCHtml
 
 function renderCHtml(inputOptions, outputOptions) {
   return createRenderer(createInput(inputOptions), createOutput(outputOptions))

packages/rehype-mathjax/index.js

@@ -1 +1,3 @@
-module.exports = require('./svg')
+import rehypeMathJaxSvg from './svg.js'
+
+export default rehypeMathJaxSvg

packages/rehype-mathjax/lib/adaptor.browser.js

@@ -1,2 +1,3 @@
-module.exports =
-  require('mathjax-full/js/adaptors/browserAdaptor').browserAdaptor
+import {browserAdaptor} from 'mathjax-full/js/adaptors/browserAdaptor.js'
+
+export {browserAdaptor}

packages/rehype-mathjax/lib/adaptor.js

@@ -1,8 +1,6 @@
-const JsDom = require('jsdom').JSDOM
-const adaptor = require('mathjax-full/js/adaptors/jsdomAdaptor').jsdomAdaptor
+import {JSDOM} from 'jsdom'
+import {jsdomAdaptor} from 'mathjax-full/js/adaptors/jsdomAdaptor.js'
 
-module.exports = createAdaptor
-
-function createAdaptor() {
-  return adaptor(JsDom)
+export function createAdaptor() {
+  return jsdomAdaptor(JSDOM)
 }

packages/rehype-mathjax/lib/core.js

@@ -1,10 +1,8 @@
-const visit = require('unist-util-visit')
-
-module.exports = createPlugin
+import visit from 'unist-util-visit'
 
 // To do next major: Remove `chtml` and `browser` flags once all the options use
 // the same format.
-function createPlugin(displayName, createRenderer, chtml, browser) {
+export function createPlugin(displayName, createRenderer, chtml, browser) {
   attacher.displayName = displayName
 
   return attacher

packages/rehype-mathjax/lib/input.js

@@ -1,8 +1,6 @@
-const Tex = require('mathjax-full/js/input/tex').TeX
-const packages = require('mathjax-full/js/input/tex/AllPackages').AllPackages
+import {TeX} from 'mathjax-full/js/input/tex.js'
+import {AllPackages} from 'mathjax-full/js/input/tex/AllPackages.js'
 
-module.exports = createInput
-
-function createInput(options) {
-  return new Tex(Object.assign({packages: packages}, options))
+export function createInput(options) {
+  return new TeX(Object.assign({packages: AllPackages}, options))
 }

packages/rehype-mathjax/lib/output-chtml.js

@@ -1,7 +1,5 @@
-const CHtml = require('mathjax-full/js/output/chtml').CHTML
+import {CHTML} from 'mathjax-full/js/output/chtml.js'
 
-module.exports = createOutput
-
-function createOutput(options) {
-  return new CHtml(options)
+export function createOutput(options) {
+  return new CHTML(options)
 }

packages/rehype-mathjax/lib/output-svg.js

@@ -1,7 +1,5 @@
-const Svg = require('mathjax-full/js/output/svg').SVG
+import {SVG} from 'mathjax-full/js/output/svg.js'
 
-module.exports = createOutput
-
-function createOutput(options) {
-  return new Svg(options)
+export function createOutput(options) {
+  return new SVG(options)
 }

packages/rehype-mathjax/lib/renderer.js

@@ -1,10 +1,8 @@
-const mathjax = require('mathjax-full/js/mathjax').mathjax
-const register = require('mathjax-full/js/handlers/html').RegisterHTMLHandler
-const fromDom = require('hast-util-from-dom')
-const toText = require('hast-util-to-text')
-const createAdaptor = require('./adaptor')
-
-module.exports = renderer
+import {mathjax} from 'mathjax-full/js/mathjax.js'
+import {RegisterHTMLHandler} from 'mathjax-full/js/handlers/html.js'
+import fromDom from 'hast-util-from-dom'
+import toText from 'hast-util-to-text'
+import {createAdaptor} from './adaptor.js'
 
 const adaptor = createAdaptor()
 
@@ -18,9 +16,10 @@ const adaptor = createAdaptor()
 // `mathjax.handlers.unregister(handler)`.
 // That is to prevent memory leak in `mathjax.handlers` whenever a new instance
 // of the plugin is used.
-register(adaptor)
+/* eslint-disable-next-line new-cap */
+RegisterHTMLHandler(adaptor)
 
-function renderer(input, output) {
+export function createRenderer(input, output) {
   const doc = mathjax.document('', {InputJax: input, OutputJax: output})
 
   return {render: render, styleSheet: styleSheet}