8
8
[ ![ Backers] [ backers-badge ]] [ collective ]
9
9
[ ![ Chat] [ chat-badge ]] [ chat ]
10
10
11
- [ ** hast** ] [ hast ] utility to parse the [ * tree* ] [ tree ] again, now supporting
12
- embedded ` raw ` nodes.
11
+ [ hast] [ ] utility to parse the tree and semistandard ` raw ` nodes (strings of
12
+ HTML) again, keeping positional info okay.
13
+
14
+ ## Contents
15
+
16
+ * [ What is this?] ( #what-is-this )
17
+ * [ When should I use this?] ( #when-should-i-use-this )
18
+ * [ Install] ( #install )
19
+ * [ Use] ( #use )
20
+ * [ API] ( #api )
21
+ * [ ` raw(tree[, file][, options]) ` ] ( #rawtree-file-options )
22
+ * [ Types] ( #types )
23
+ * [ Compatibility] ( #compatibility )
24
+ * [ Security] ( #security )
25
+ * [ Related] ( #related )
26
+ * [ Contribute] ( #contribute )
27
+ * [ License] ( #license )
28
+
29
+ ## What is this?
30
+
31
+ This package is a utility to parse a document again.
32
+ It passes each node and embedded raw HTML through an HTML parser
33
+ ([ ` parse5 ` ] [ parse5 ] ), to recreate a tree exactly as how a browser would parse
34
+ it, while keeping the original data and positional info intact.
35
+
36
+ ## When should I use this?
37
+
38
+ This utility is particularly useful when coming from markdown and wanting to
39
+ support HTML embedded inside that markdown (which requires passing
40
+ ` allowDangerousHtml: true ` to ` mdast-util-to-hast ` ).
41
+ Markdown dictates how, say, a list item or emphasis can be parsed.
42
+ We can use that to turn the markdown syntax tree into an HTML syntax tree.
43
+ But markdown also dictates that things that look like HTML, are passed through
44
+ untouched, even when it just looks like XML but doesn’t really make sense, so we
45
+ can’t normally use these strings of “HTML” to create an HTML syntax tree.
46
+ This utility can.
47
+ It can be used to take those strings of HTML and include them into the syntax
48
+ tree as actual nodes.
49
+
50
+ If your final result is HTML and you trust content, then “strings” are fine
51
+ (you can pass ` allowDangerousHtml: true ` to ` hast-util-to-html ` , which passes
52
+ HTML through untouched).
53
+ But there are two main cases where a proper syntax tree is preferred:
54
+
55
+ * hast utilities need a proper syntax tree as they operate on actual nodes to
56
+ inspect or transform things, they can’t operate on strings of HTML
57
+ * other output formats (React, MDX, etc) need actual nodes and can’t handle
58
+ strings of HTML
59
+
60
+ The plugin [ ` rehype-raw ` ] [ rehype-raw ] wraps this utility at a higher-level
61
+ (easier) abstraction.
13
62
14
- One of the reasons to do this is for “malformed” syntax trees: for example, say
15
- there’s an ` h1 ` element in a ` p ` element, this utility will make them siblings.
63
+ ## Install
16
64
17
- Another reason to do this is if raw HTML/XML is embedded in a syntax tree, which
18
- can occur when coming from Markdown using [ ` mdast-util-to-hast ` ] [ to-hast ] .
65
+ This package is [ ESM only ] [ esm ] .
66
+ In Node.js (version 12.20+, 14.14+, 16.0+, or 18.0+), install with [ npm ] [ ] :
19
67
20
- If you’re working with [ ** remark** ] [ remark ] and/or
21
- [ ` remark-rehype ` ] [ remark-rehype ] , use [ ` rehype-raw ` ] [ rehype-raw ] instead.
68
+ ``` sh
69
+ npm install hast-util-raw
70
+ ```
22
71
23
- ## Install
72
+ In Deno with [ ` esm.sh ` ] [ esmsh ] :
24
73
25
- This package is [ ESM only] ( https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c ) :
26
- Node 12+ is needed to use it and it must be ` import ` ed instead of ` require ` d.
74
+ ``` js
75
+ import {raw } from ' https://esm.sh/hast-util-raw@7'
76
+ ```
27
77
28
- [ npm ] [ ] :
78
+ In browsers with [ ` esm.sh ` ] [ esmsh ] :
29
79
30
- ``` sh
31
- npm install hast-util-raw
80
+ ``` html
81
+ <script type =" module" >
82
+ import {raw } from ' https://esm.sh/hast-util-raw@7?bundle'
83
+ </script >
32
84
```
33
85
34
86
## Use
@@ -64,21 +116,58 @@ Yields:
64
116
65
117
## API
66
118
67
- This package exports the following identifiers: ` raw ` .
119
+ This package exports the identifier ` raw ` .
68
120
There is no default export.
69
121
70
122
### ` raw(tree[, file][, options]) `
71
123
72
- Given a [ ** hast** ] [ hast ] [ * tree* ] [ tree ] and an optional [ vfile] [ ] (for
73
- [ positional info] [ position-information ] ), return a new parsed-again
74
- [ ** hast** ] [ hast ] [ * tree* ] [ tree ] .
124
+ Parse the tree and raw nodes (strings of HTML) again, keeping positional info
125
+ okay.
126
+
127
+ > 👉 ** Note** : ` tree ` should have positional info and ` file ` , when given, must
128
+ > be a [ vfile] [ ] corresponding to ` tree ` .
129
+
130
+ ##### ` options `
131
+
132
+ Configuration (optional).
75
133
76
134
###### ` options.passThrough `
77
135
78
- List of custom hast node types to pass through (keep) in hast
79
- ( ` Array<string> ` , default: ` [] ` ).
136
+ List of custom hast node types to pass through (keep) in hast ( ` Array<string> ` ,
137
+ default: ` [] ` ).
80
138
If the passed through nodes have children, those children are expected to be
81
- hast and will be handled.
139
+ hast and will be handled by this utility.
140
+
141
+ ## Types
142
+
143
+ This package is fully typed with [ TypeScript] [ ] .
144
+ It exports the additional type ` Options ` .
145
+
146
+ It also registers the ` Raw ` node type with ` @types/hast ` .
147
+ If you’re working with the syntax tree, make sure to import this utility
148
+ somewhere in your types, as that registers the new node types in the tree.
149
+
150
+ ``` js
151
+ /**
152
+ * @typedef {import('hast-util-raw')}
153
+ */
154
+
155
+ import {visit } from ' unist-util-visit'
156
+
157
+ /** @type {import('hast').Root} */
158
+ const tree = getHastNodeSomeHow ()
159
+
160
+ visit (tree, (node ) => {
161
+ // `node` can now be a `raw` node.
162
+ })
163
+ ```
164
+
165
+ ## Compatibility
166
+
167
+ Projects maintained by the unified collective are compatible with all maintained
168
+ versions of Node.js.
169
+ As of now, that is Node.js 12.20+, 14.14+, 16.0+, and 18.0+.
170
+ Our projects sometimes work with older versions, but this is not guaranteed.
82
171
83
172
## Security
84
173
@@ -97,20 +186,20 @@ Yields:
97
186
<script >alert (1 ) </script >
98
187
```
99
188
100
- Do not use this utility in combination with user input or use
101
- [ ` hast-util-santize ` ] [ sanitize ] .
189
+ Either do not use this utility in combination with user input, or use
190
+ [ ` hast-util-santize ` ] [ hast-util- sanitize] .
102
191
103
192
## Related
104
193
105
194
* [ ` mdast-util-to-hast ` ] ( https://github.com/syntax-tree/mdast-util-to-hast )
106
195
— transform mdast to hast
107
196
* [ ` rehype-raw ` ] ( https://github.com/rehypejs/rehype-raw )
108
- — wrapper plugin for [ rehype ] ( https://github.com/rehypejs/rehype )
197
+ — rehype plugin
109
198
110
199
## Contribute
111
200
112
- See [ ` contributing.md ` in ` syntax-tree/.github ` ] [ contributing ] for ways to get
113
- started.
201
+ See [ ` contributing.md ` ] [ contributing ] in [ ` syntax-tree/.github ` ] [ health ] for
202
+ ways to get started.
114
203
See [ ` support.md ` ] [ support ] for ways to get help.
115
204
116
205
This project has a [ code of conduct] [ coc ] .
@@ -151,32 +240,32 @@ abide by its terms.
151
240
152
241
[ npm ] : https://docs.npmjs.com/cli/install
153
242
243
+ [ esm ] : https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
244
+
245
+ [ esmsh ] : https://esm.sh
246
+
247
+ [ typescript ] : https://www.typescriptlang.org
248
+
154
249
[ license ] : license
155
250
156
251
[ author ] : https://wooorm.com
157
252
158
- [ contributing ] : https://github.com/syntax-tree/.github/blob/HEAD/contributing.md
253
+ [ health ] : https://github.com/syntax-tree/.github
159
254
160
- [ support ] : https://github.com/syntax-tree/.github/blob/HEAD/support .md
255
+ [ contributing ] : https://github.com/syntax-tree/.github/blob/main/contributing .md
161
256
162
- [ coc ] : https://github.com/syntax-tree/.github/blob/HEAD/code-of-conduct .md
257
+ [ support ] : https://github.com/syntax-tree/.github/blob/main/support .md
163
258
164
- [ tree ] : https://github.com/syntax-tree/unist#tree
259
+ [ coc ] : https://github.com/syntax-tree/.github/blob/main/code-of-conduct.md
165
260
166
- [ position-information ] : https://github.com/syntax-tree/unist#positional-information
261
+ [ xss ] : https://en.wikipedia.org/wiki/Cross-site_scripting
167
262
168
263
[ hast ] : https://github.com/syntax-tree/hast
169
264
170
- [ to- hast] : https://github.com/syntax-tree/mdast -util-to-hast
265
+ [ hast-util-sanitize ] : https://github.com/syntax-tree/hast -util-sanitize
171
266
172
267
[ vfile ] : https://github.com/vfile/vfile
173
268
174
- [ remark ] : https://github.com/remarkjs/remark
175
-
176
- [ remark-rehype ] : https://github.com/remarkjs/remark-rehype
177
-
178
269
[ rehype-raw ] : https://github.com/rehypejs/rehype-raw
179
270
180
- [ xss ] : https://en.wikipedia.org/wiki/Cross-site_scripting
181
-
182
- [ sanitize ] : https://github.com/syntax-tree/hast-util-sanitize
271
+ [ parse5 ] : https://github.com/inikulin/parse5
0 commit comments