type: Fix rehype-rewrite type errors.

uiwjs · Oct 2, 2021 · 09eb95d · 09eb95d
1 parent e372605
commit 09eb95d
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 29 deletions.
diff --git a/package.json b/package.json
@@ -12,7 +12,7 @@
     "css:build": "compile-less -d src -o esm",
     "css:watch": "compile-less -d src -o esm --watch",
     "css:build:dist": "compile-less -d src --combine markdown.css --rm-global",
-    "watch": "tsbb watch",
+    "watch": "tsbb watch & npm run css:watch",
     "build": "tsbb build && npm run css:build && npm run css:build:dist",
     "test": "tsbb test --env=jsdom",
     "coverage": "tsbb test --env=jsdom --coverage"

diff --git a/src/index.tsx b/src/index.tsx
@@ -1,5 +1,6 @@
 import React, { useImperativeHandle } from 'react';
 import ReactMarkdown, { Options } from 'react-markdown';
+import { Root, Element, ElementContent } from 'hast';
 import gfm from 'remark-gfm';
 import slug from 'rehype-slug';
 import headings from 'rehype-autolink-headings'
@@ -10,35 +11,36 @@ import rehypeRewrite from 'rehype-rewrite';
 import './styles/markdown.less';
 import './styles/markdowncolor.less';
 
-const rehypeRewriteHandle = (node: any, index: number, parent: any) => {
-  if (node.type === 'element' && parent.type === 'root' && /h(1|2|3|4|5|6)/.test(node.tagName)) {
-    const child = node.children && node.children[0];
+const octiconLink: Element = {
+  type: 'element',
+  tagName: 'svg',
+  properties: {
+    class: 'octicon octicon-link',
+    viewBox: '0 0 16 16',
+    version: '1.1',
+    width: '16',
+    height: '16',
+    ariaHidden: 'true',
+  },
+  children: [
+    {
+      type: 'element',
+      tagName: 'path',
+      children: [],
+      properties: {
+        fillRule: 'evenodd',
+        d: 'M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z',
+      }
+    }
+  ]
+}
+
+const rehypeRewriteHandle = (node: ElementContent, index: number | null, parent: Root | Element | null) => {
+  if (node.type === 'element' && parent && parent.type === 'root' && /h(1|2|3|4|5|6)/.test(node.tagName)) {
+    const child = node.children && node.children[0] as Element;
     if (child && child.properties && child.properties.ariaHidden === 'true') {
       child.properties = { class: 'anchor', ...child.properties };
-      child.children = [
-        {
-          type: 'element',
-          tagName: 'svg',
-          properties: {
-            class: 'octicon octicon-link',
-            viewBox: '0 0 16 16',
-            version: '1.1',
-            width: '16',
-            height: '16',
-            ariaHidden: 'true',
-          },
-          children: [
-            {
-              type: 'element',
-              tagName: 'path',
-              properties: {
-                fillRule: 'evenodd',
-                d: 'M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z',
-              }
-            }
-          ]
-        }
-      ];
+      child.children = [ octiconLink ];
     }
   }
 }
@@ -66,7 +68,7 @@ export default React.forwardRef<MarkdownPreviewRef, MarkdownPreviewProps>((props
     <div ref={mdp} onScroll={onScroll} onMouseOver={onMouseOver} {...warpperElement} className={cls} style={style}>
       <ReactMarkdown
         {...other}
-        rehypePlugins={[[rehypePrism, { ignoreMissing: true }], slug, headings, [rehypeRewrite as any, rehypeRewriteHandle], rehypeRaw, ...(other.rehypePlugins || [])]}
+        rehypePlugins={[[rehypePrism, { ignoreMissing: true }], slug, headings, [rehypeRewrite, rehypeRewriteHandle], rehypeRaw, ...(other.rehypePlugins || [])]}
         remarkPlugins={[ ...(other.remarkPlugins || []), gfm ]}
         children={source || ''}
       />