chore(mdx-loader): migrate package to TypeScript (#5347)

* Polish code style

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Partly done migration

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Complete typing

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Fix tests

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* A-ha

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Cleanup

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Fix error

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

* Cleanup

Signed-off-by: Josh-Cena <sidachen2003@gmail.com>

packages/docusaurus-mdx-loader/src/remark/toc/index.ts

@@ -5,34 +5,42 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-const {parse} = require('@babel/parser');
-const traverse = require('@babel/traverse').default;
-const stringifyObject = require('stringify-object');
-const search = require('./search');
+import {parse, ParserOptions} from '@babel/parser';
+import type {Identifier} from '@babel/types';
+import traverse from '@babel/traverse';
+import stringifyObject from 'stringify-object';
+import search from './search';
+import type {Plugin, Transformer} from 'unified';
+import type {Node, Parent} from 'unist';
+import type {Literal} from 'mdast';
 
-const parseOptions = {
+const parseOptions: ParserOptions = {
   plugins: ['jsx'],
   sourceType: 'module',
 };
-const isImport = (child) => child.type === 'import';
-const hasImports = (index) => index > -1;
-const isExport = (child) => child.type === 'export';
 
-const isTarget = (child, name) => {
+const isImport = (child: Node): child is Literal => child.type === 'import';
+const hasImports = (index: number) => index > -1;
+const isExport = (child: Node): child is Literal => child.type === 'export';
+
+interface PluginOptions {
+  name?: string;
+}
+
+const isTarget = (child: Literal, name: string) => {
   let found = false;
   const ast = parse(child.value, parseOptions);
   traverse(ast, {
     VariableDeclarator: (path) => {
-      if (path.node.id.name === name) {
+      if ((path.node.id as Identifier).name === name) {
         found = true;
       }
     },
   });
-
   return found;
 };
 
-const getOrCreateExistingTargetIndex = (children, name) => {
+const getOrCreateExistingTargetIndex = (children: Node[], name: string) => {
   let importsIndex = -1;
   let targetIndex = -1;
 
@@ -58,12 +66,12 @@ const getOrCreateExistingTargetIndex = (children, name) => {
   return targetIndex;
 };
 
-const plugin = (options = {}) => {
+const plugin: Plugin<[PluginOptions?]> = (options = {}) => {
   const name = options.name || 'toc';
 
-  const transformer = (node) => {
+  const transformer: Transformer = (node) => {
     const headings = search(node);
-    const {children} = node;
+    const {children} = node as Parent<Literal>;
     const targetIndex = getOrCreateExistingTargetIndex(children, name);
 
     if (headings && headings.length) {
@@ -76,4 +84,4 @@ const plugin = (options = {}) => {
   return transformer;
 };
 
-module.exports = plugin;
+export default plugin;

packages/docusaurus-mdx-loader/src/remark/toc/search.js

@@ -1,73 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-// @ts-check
-
-const toString = require('mdast-util-to-string');
-const visit = require('unist-util-visit');
-// Destructuring require tslib
-// eslint-disable-next-line prefer-destructuring
-const toValue = require('../utils').toValue;
-
-/** @typedef {import('@docusaurus/types').TOCItem} TOC */
-/** @typedef {import('unist').Node} Node */
-
-/**
- * @typedef {Object} StringValuedNode
- * @property {string} type
- * @property {string} value
- * @property {number} depth
- * @property {Object} data
- * @property {StringValuedNode[]} children
- */
-
-// Visit all headings. We `slug` all headings (to account for
-// duplicates), but only take h2 and h3 headings.
-/**
- * @param {StringValuedNode} node
- * @returns {TOC[]}
- */
-function search(node) {
-  /** @type {TOC[]} */
-  const headings = [];
-  let current = -1;
-  let currentDepth = 0;
-
-  /**
-   * @param {StringValuedNode} child
-   * @param {number} index
-   * @param {Node | undefined} parent
-   * @returns {void}
-   */
-  const onHeading = (child, index, parent) => {
-    const value = toString(child);
-
-    if (parent !== node || !value || child.depth > 3 || child.depth < 2) {
-      return;
-    }
-
-    const entry = {
-      value: toValue(child),
-      id: child.data.id,
-      children: [],
-    };
-
-    if (!headings.length || currentDepth >= child.depth) {
-      headings.push(entry);
-      current += 1;
-      currentDepth = child.depth;
-    } else {
-      headings[current].children.push(entry);
-    }
-  };
-
-  visit(node, 'heading', onHeading);
-
-  return headings;
-}
-
-module.exports = search;

packages/docusaurus-mdx-loader/src/remark/toc/search.ts

@@ -0,0 +1,47 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import toString from 'mdast-util-to-string';
+import visit, {Visitor} from 'unist-util-visit';
+import {toValue} from '../utils';
+import type {TOCItem as TOC} from '@docusaurus/types';
+import type {Node} from 'unist';
+import type {Heading} from 'mdast';
+
+// Visit all headings. We `slug` all headings (to account for
+// duplicates), but only take h2 and h3 headings.
+export default function search(node: Node): TOC[] {
+  const headings: TOC[] = [];
+  let current = -1;
+  let currentDepth = 0;
+
+  const visitor: Visitor<Heading> = (child, _index, parent) => {
+    const value = toString(child);
+
+    if (parent !== node || !value || child.depth > 3 || child.depth < 2) {
+      return;
+    }
+
+    const entry: TOC = {
+      value: toValue(child),
+      id: child.data!.id as string,
+      children: [],
+    };
+
+    if (!headings.length || currentDepth >= child.depth) {
+      headings.push(entry);
+      current += 1;
+      currentDepth = child.depth;
+    } else {
+      headings[current].children.push(entry);
+    }
+  };
+
+  visit(node, 'heading', visitor);
+
+  return headings;
+}