Update @types/hast, utilities, plugins, etc

lib/ast-to-react.js

@@ -16,7 +16,7 @@
  * @typedef {import('hast').Root} Root
  * @typedef {import('hast').Text} Text
  * @typedef {import('hast').Comment} Comment
- * @typedef {import('hast').DocType} Doctype
+ * @typedef {import('hast').Doctype} Doctype
  * @typedef {import('property-information').Info} Info
  * @typedef {import('property-information').Schema} Schema
  * @typedef {import('./complex-types.js').ReactMarkdownProps} ReactMarkdownProps

package.json

@@ -79,21 +79,21 @@
     "react-markdown.min.js"
   ],
   "dependencies": {
-    "@types/hast": "^2.0.0",
+    "@types/hast": "^3.0.0",
     "@types/prop-types": "^15.0.0",
-    "@types/unist": "^2.0.0",
+    "@types/unist": "^3.0.0",
     "comma-separated-tokens": "^2.0.0",
-    "hast-util-whitespace": "^2.0.0",
+    "hast-util-whitespace": "^3.0.0",
     "prop-types": "^15.0.0",
     "property-information": "^6.0.0",
     "react-is": "^18.0.0",
-    "remark-parse": "^10.0.0",
-    "remark-rehype": "^10.0.0",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.0.0",
     "space-separated-tokens": "^2.0.0",
     "style-to-object": "^0.4.0",
-    "unified": "^10.0.0",
-    "unist-util-visit": "^4.0.0",
-    "vfile": "^5.0.0"
+    "unified": "^11.0.0",
+    "unist-util-visit": "^5.0.0",
+    "vfile": "^6.0.0"
   },
   "peerDependencies": {
     "@types/react": ">=16",
@@ -114,11 +114,11 @@
     "prettier": "^3.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "rehype-raw": "^6.0.0",
+    "rehype-raw": "^7.0.0",
     "remark-cli": "^11.0.0",
-    "remark-gfm": "^3.0.0",
+    "remark-gfm": "^4.0.0",
     "remark-preset-wooorm": "^9.0.0",
-    "remark-toc": "^8.0.0",
+    "remark-toc": "^9.0.0",
     "type-coverage": "^2.0.0",
     "typescript": "^5.0.0",
     "xo": "^0.56.0"
@@ -143,7 +143,7 @@
     "plugins": [
       "remark-preset-wooorm",
       [
-        "remark-gfm",
+        "./node_modules/remark-preset-wooorm/node_modules/remark-gfm/index.js",
         {
           "tablePipeAlign": false
         }

test/fixtures/runthrough.html

@@ -152,10 +152,10 @@ <h2>HTML entities</h2>
 <p>Some characters, like æ, &amp; and similar should be handled properly.</p>
 <h2>HTML</h2>
 <p>Does anyone actually like the fact that you can embed HTML in markdown?</p>
-<iframe src="https://foo.bar/" width="640" height="480">
-We used to have a known bug where inline HTML wasn&#x27;t handled well. You can do basic tags like
-code</iframe>, as long as it doesn&#x27;t contain any <span class="attrs">attributes</span>. If you
+<iframe src="https://foo.bar/" width="640" height="480"></iframe>
+<p>We used to have a known bug where inline HTML wasn&#x27;t handled well. You can do basic tags like
+<code>code</code>, as long as it doesn&#x27;t contain any <span class="attrs">attributes</span>. If you
 have weird ordering on your tags, it won&#x27;t work either. It does support <strong>nested
-<em>tags</em>, however</strong>. And with the <code class="name">rehype-raw</code> plugin, it can now properly handle HTML! Which is pretty sweet.<p></p>
+<em>tags</em>, however</strong>. And with the <code class="name">rehype-raw</code> plugin, it can now properly handle HTML! Which is pretty sweet.</p>
 <hr/><hr/>
 <p>Cool, eh?</p>

test/fixtures/runthrough.md

@@ -159,7 +159,7 @@ Does anyone actually like the fact that you can embed HTML in markdown?
   src="https://foo.bar/"
   width="640"
   height="480"
-/>
+></iframe>
 
 We used to have a known bug where inline HTML wasn't handled well. You can do basic tags like
 <code>code</code>, as long as it doesn't contain any <span class="attrs">attributes</span>. If you

test/test.jsx

@@ -835,7 +835,7 @@ test('should render footnote with custom options', () => {
         remarkRehypeOptions={{clobberPrefix: 'main-'}}
       />
     ),
-    '<p>This is a statement<sup><a href="#main-fn-1" id="main-fnref-1" data-footnote-ref="true" aria-describedby="footnote-label">1</a></sup> with a citation.</p>\n<section data-footnotes="true" class="footnotes"><h2 class="sr-only" id="footnote-label">Footnotes</h2>\n<ol>\n<li id="main-fn-1">\n<p>This is a footnote for the citation. <a href="#main-fnref-1" data-footnote-backref="true" class="data-footnote-backref" aria-label="Back to content">↩</a></p>\n</li>\n</ol>\n</section>'
+    '<p>This is a statement<sup><a href="#main-fn-1" id="main-fnref-1" data-footnote-ref="true" aria-describedby="footnote-label">1</a></sup> with a citation.</p>\n<section data-footnotes="true" class="footnotes"><h2 class="sr-only" id="footnote-label">Footnotes</h2>\n<ol>\n<li id="main-fn-1">\n<p>This is a footnote for the citation. <a href="#main-fnref-1" data-footnote-backref="" aria-label="Back to reference 1" class="data-footnote-backref">↩</a></p>\n</li>\n</ol>\n</section>'
   )
 })
 
@@ -1155,9 +1155,10 @@ test('should render table of contents plugin', () => {
   const actual = asHtml(
     <Markdown children={input} remarkPlugins={[remarkToc]} />
   )
+
   assert.equal(
     actual,
-    '<h1>Header</h1>\n<h2>Table of Contents</h2>\n<ul>\n<li>\n<p><a href="#first-section">First Section</a></p>\n</li>\n<li>\n<p><a href="#second-section">Second Section</a></p>\n<ul>\n<li><a href="#subsection">Subsection</a></li>\n</ul>\n</li>\n<li>\n<p><a href="#third-section">Third Section</a></p>\n</li>\n</ul>\n<h2>First Section</h2>\n<h2>Second Section</h2>\n<h3>Subsection</h3>\n<h2>Third Section</h2>'
+    '<h1>Header</h1>\n<h2>Table of Contents</h2>\n<ul>\n<li><a href="#first-section">First Section</a></li>\n<li><a href="#second-section">Second Section</a>\n<ul>\n<li><a href="#subsection">Subsection</a></li>\n</ul>\n</li>\n<li><a href="#third-section">Third Section</a></li>\n</ul>\n<h2>First Section</h2>\n<h2>Second Section</h2>\n<h3>Subsection</h3>\n<h2>Third Section</h2>'
   )
 })