@@ -343,15 +343,15 @@ Yields:
343343### Example: turning hast into react nodes
344344
345345hast trees as returned by refractor can be turned into React (or Preact) with
346- [ ` hast-to-hyperscript ` ] [ github-hast-to-hyperscript ] :
346+ [ ` hast-util- to-jsx-runtime ` ] [ github-hast-util- to-jsx-runtime ] :
347347
348348``` js
349+ import {toJsxRuntime } from ' hast-util-to-jsx-runtime'
350+ import {Fragment , jsxs , jsx } from ' react/jsx-runtime'
349351import {refractor } from ' refractor'
350- import {toH } from ' hast-to-hyperscript'
351- import React from ' react'
352352
353353const tree = refractor .highlight (' "use strict";' , ' js' )
354- const react = toH ( React . createElement , tree )
354+ const reactNode = toJsxRuntime (tree, {Fragment, jsxs, jsx} )
355355
356356console .log (react)
357357```
@@ -789,10 +789,10 @@ See [How to Contribute to Open Source][opensource-guide].
789789
790790[ github-hast-root ] : https://github.com/syntax-tree/hast#root
791791
792- [ github-hast-to-hyperscript ] : https://github.com/syntax-tree/hast-to-hyperscript
793-
794792[ github-hast-util-to-html ] : https://github.com/syntax-tree/hast-util-to-html
795793
794+ [ github-hast-util-to-jsx-runtime ] : https://github.com/syntax-tree/hast-util-to-jsx-runtime
795+
796796[ github-highlightjs ] : https://github.com/highlightjs/highlight.js
797797
798798[ github-lowlight ] : https://github.com/wooorm/lowlight
0 commit comments