1
1
# hast-util-to-dom
2
2
3
- [ ![ Build] [ build-badge ]] [ build ]
4
- [ ![ Coverage] [ coverage-badge ]] [ coverage ]
5
- [ ![ Downloads] [ downloads-badge ]] [ downloads ]
6
- [ ![ Size] [ size-badge ]] [ size ]
7
- [ ![ Sponsors] [ sponsors-badge ]] [ collective ]
8
- [ ![ Backers] [ backers-badge ]] [ collective ]
9
- [ ![ Chat] [ chat-badge ]] [ chat ]
3
+ [ ![ Build] [ badge-build-image ]] [ badge-build-url ]
4
+ [ ![ Coverage] [ badge-coverage-image ]] [ badge-coverage-url ]
5
+ [ ![ Downloads] [ badge-downloads-image ]] [ badge-downloads-url ]
6
+ [ ![ Size] [ badge-size-image ]] [ badge-size-url ]
10
7
11
- [ hast] [ ] utility to transform to a [ DOM] [ ] tree.
8
+ [ hast] [ github-hast ] utility to transform to a [ DOM] [ mozilla-dom ] tree.
12
9
13
10
## Contents
14
11
15
- * [ What is this?] ( #what-is-this )
16
- * [ When should I use this?] ( #when-should-i-use-this )
17
- * [ Install] ( #install )
18
- * [ Use] ( #use )
19
- * [ API] ( #api )
20
- * [ ` toDom(tree[, options]) ` ] ( #todomtree-options )
21
- * [ ` AfterTransform ` ] ( #aftertransform )
22
- * [ ` Options ` ] ( #options )
23
- * [ Syntax tree] ( #syntax-tree )
24
- * [ Types] ( #types )
25
- * [ Compatibility] ( #compatibility )
26
- * [ Security] ( #security )
27
- * [ Related] ( #related )
28
- * [ Contribute] ( #contribute )
29
- * [ License] ( #license )
12
+ * [ What is this?] ( #what-is-this )
13
+ * [ When should I use this?] ( #when-should-i-use-this )
14
+ * [ Install] ( #install )
15
+ * [ Use] ( #use )
16
+ * [ API] ( #api )
17
+ * [ ` toDom(tree[, options]) ` ] ( #todomtree-options )
18
+ * [ ` AfterTransform ` ] ( #aftertransform )
19
+ * [ ` Options ` ] ( #options )
20
+ * [ Syntax tree] ( #syntax-tree )
21
+ * [ Types] ( #types )
22
+ * [ Compatibility] ( #compatibility )
23
+ * [ Security] ( #security )
24
+ * [ Related] ( #related )
25
+ * [ Contribute] ( #contribute )
26
+ * [ License] ( #license )
30
27
31
28
## What is this?
32
29
33
- This package is a utility that creates a DOM tree (defaulting to the actual DOM
34
- but also supporting things like [ ` jsdom ` ] [ jsdom ] ) from a [ hast] [ ] (HTML) syntax
35
- tree.
30
+ This package is a utility that creates a DOM tree
31
+ (defaulting to the actual DOM but also supporting things like
32
+ [ ` jsdom ` ] [ github-jsdom ] )
33
+ from a [ hast] [ github-hast ] (HTML) syntax tree.
36
34
37
35
## When should I use this?
38
36
39
37
You can use this project when you want to turn hast into a DOM in browsers,
40
38
either to use it directly on a page, or to enable the use of DOM APIs (such as
41
39
` querySelector ` to find things or ` innerHTML ` to serialize stuff).
42
40
43
- The hast utility [ ` hast-util-from-dom ` ] [ hast-util-from-dom ] does the inverse of
44
- this utility.
41
+ The hast utility [ ` hast-util-from-dom ` ] [ github- hast-util-from-dom] does the
42
+ inverse of this utility.
45
43
It turns DOM trees into hast.
46
44
47
- The rehype plugin [ ` rehype-dom-stringify ` ] [ rehype-dom-stringify ] wraps this
48
- utility to serialize as HTML with DOM APIs.
45
+ The rehype plugin [ ` rehype-dom-stringify ` ] [ github- rehype-dom-stringify] wraps
46
+ this utility to serialize as HTML with DOM APIs.
49
47
50
48
## Install
51
49
52
- This package is [ ESM only] [ esm ] .
53
- In Node.js (version 16+), install with [ npm] [ ] :
50
+ This package is [ ESM only] [ github-gist- esm] .
51
+ In Node.js (version 16+), install with [ npm] [ npmjs-install ] :
54
52
55
53
``` sh
56
54
npm install hast-util-to-dom
@@ -105,25 +103,25 @@ Turn a hast tree into a DOM tree.
105
103
106
104
###### Parameters
107
105
108
- * ` tree ` ([ ` HastNode ` ] [ hast-node ] )
109
- — tree to transform
110
- * ` options ` ([ ` Options ` ] [ api-options ] , optional)
111
- — configuration
106
+ * ` tree ` ([ ` HastNode ` ] [ github- hast-nodes ] )
107
+ — tree to transform
108
+ * ` options ` ([ ` Options ` ] [ api-options ] , optional)
109
+ — configuration
112
110
113
111
###### Returns
114
112
115
- DOM node ([ ` DomNode ` ] [ dom-node ] ).
113
+ DOM node ([ ` DomNode ` ] [ mozilla- dom-node] ).
116
114
117
115
### ` AfterTransform `
118
116
119
117
Callback called when each node is transformed (TypeScript type).
120
118
121
119
###### Parameters
122
120
123
- * ` hastNode ` ([ ` HastNode ` ] [ hast-node ] )
124
- — hast node that was handled
125
- * ` domNode ` ([ ` DomNode ` ] [ dom-node ] )
126
- — corresponding DOM node
121
+ * ` hastNode ` ([ ` HastNode ` ] [ github- hast-nodes ] )
122
+ — hast node that was handled
123
+ * ` domNode ` ([ ` DomNode ` ] [ mozilla- dom-node] )
124
+ — corresponding DOM node
127
125
128
126
###### Returns
129
127
@@ -135,18 +133,18 @@ Configuration (TypeScript type).
135
133
136
134
###### Fields
137
135
138
- * ` afterTransform ` ([ ` AfterTransform ` ] [ api-after-transform ] , optional)
139
- — callback called when each node is transformed
140
- * ` document ` (` Document ` , default: ` globalThis.document ` )
141
- — document interface to use.
142
- * ` fragment ` (` boolean ` , default: ` false ` )
143
- — whether to return a DOM fragment (` true ` ) or a whole document (` false ` )
144
- * ` namespace ` (` string ` , default: depends)
145
- — namespace to use to create elements
136
+ * ` afterTransform ` ([ ` AfterTransform ` ] [ api-after-transform ] , optional)
137
+ — callback called when each node is transformed
138
+ * ` document ` (` Document ` , default: ` globalThis.document ` )
139
+ — document interface to use.
140
+ * ` fragment ` (` boolean ` , default: ` false ` )
141
+ — whether to return a DOM fragment (` true ` ) or a whole document (` false ` )
142
+ * ` namespace ` (` string ` , default: depends)
143
+ — namespace to use to create elements
146
144
147
145
## Syntax tree
148
146
149
- The syntax tree is [ hast] [ ] .
147
+ The syntax tree is [ hast] [ github-hast ] .
150
148
151
149
## Types
152
150
@@ -167,100 +165,94 @@ compatible with Node.js 16.
167
165
## Security
168
166
169
167
Use of ` hast-util-to-dom ` can open you up to a
170
- [ cross-site scripting (XSS)] [ xss ] attack if the hast tree is unsafe.
171
- Use [ ` hast-util-santize ` ] [ hast-util-sanitize ] to make the hast tree safe.
168
+ [ cross-site scripting (XSS)] [ wikipedia-xss ] attack if the hast tree is unsafe.
169
+ Use [ ` hast-util-santize ` ] [ github-hast-util-sanitize ] to make the hast tree
170
+ safe.
172
171
173
172
## Related
174
173
175
- * [ ` hast-util-sanitize ` ] ( https:// github.com/syntax-tree/ hast-util-sanitize)
176
- — sanitize hast nodes
177
- * [ ` hast-util-to-html ` ] ( https://github.com/syntax-tree/hast-util-to-html )
178
- — serialize as HTML
179
- * [ ` hast-util-from-dom ` ] ( https:// github.com/syntax-tree/ hast-util-from-dom)
180
- — create a hast tree from a DOM tree
174
+ * [ ` hast-util-sanitize ` ] [ github- hast-util-sanitize ]
175
+ — sanitize hast nodes
176
+ * [ ` hast-util-to-html ` ] ( https://github.com/syntax-tree/hast-util-to-html )
177
+ — serialize as HTML
178
+ * [ ` hast-util-from-dom ` ] [ github- hast-util-from-dom ]
179
+ — create a hast tree from a DOM tree
181
180
182
181
## Contribute
183
182
184
- See [ ` contributing.md ` ] [ contributing ] in [ ` syntax-tree/.github ` ] [ health ] for
185
- ways to get started.
186
- See [ ` support.md ` ] [ support ] for ways to get help.
183
+ See [ ` contributing.md ` ] [ health-contributing ]
184
+ in
185
+ [ ` syntax-tree/.github ` ] [ health ]
186
+ for ways to get started.
187
+ See [ ` support.md ` ] [ health-support ] for ways to get help.
187
188
188
- This project has a [ code of conduct] [ coc ] .
189
- By interacting with this repository, organization, or community you agree to
190
- abide by its terms.
189
+ This project has a [ code of conduct] [ health-coc ] .
190
+ By interacting with this repository,
191
+ organization,
192
+ or community you agree to abide by its terms.
191
193
192
194
## License
193
195
194
- [ ISC] [ license ] © [ Keith McKnight] [ author ]
196
+ [ ISC] [ file- license] © [ Keith McKnight] [ mcknight ]
195
197
196
198
<!-- Definitions -->
197
199
198
- [ build-badge ] : https://github.com/syntax-tree/hast-util-to-dom/workflows/main/badge.svg
199
-
200
- [ build ] : https://github.com/syntax-tree/hast-util-to-dom/actions
201
-
202
- [ coverage-badge ] : https://img.shields.io/codecov/c/github/syntax-tree/hast-util-to-dom.svg
203
-
204
- [ coverage ] : https://codecov.io/github/syntax-tree/hast-util-to-dom
205
-
206
- [ downloads-badge ] : https://img.shields.io/npm/dm/hast-util-to-dom.svg
200
+ [ api-after-transform ] : #aftertransform
207
201
208
- [ downloads ] : https://www.npmjs.com/package/hast-util-to-dom
202
+ [ api-options ] : #options
209
203
210
- [ size-badge ] : https://img.shields.io/badge/dynamic/json?label=minzipped%20size&query=$.size.compressedSize&url=https://deno.bundlejs.com/?q=hast-util-to-dom
204
+ [ api-to-dom ] : #todomtree-options
211
205
212
- [ size ] : https://bundlejs .com/?q= hast-util-to-dom
206
+ [ badge-build-image ] : https://github .com/syntax-tree/ hast-util-to-dom/workflows/main/badge.svg
213
207
214
- [ sponsors- badge] : https://opencollective .com/unified/sponsors/badge.svg
208
+ [ badge-build-url ] : https://github .com/syntax-tree/hast-util-to-dom/actions
215
209
216
- [ backers- badge] : https://opencollective.com/unified/backers/badge .svg
210
+ [ badge-coverage-image ] : https://img.shields.io/codecov/c/github/syntax-tree/hast-util-to-dom .svg
217
211
218
- [ collective ] : https://opencollective.com/unified
212
+ [ badge-coverage-url ] : https://codecov.io/github/syntax-tree/hast-util-to-dom
219
213
220
- [ chat- badge] : https://img.shields.io/badge/chat-discussions-success .svg
214
+ [ badge-downloads-image ] : https://img.shields.io/npm/dm/hast-util-to-dom .svg
221
215
222
- [ chat ] : https://github. com/syntax-tree/unist/discussions
216
+ [ badge-downloads-url ] : https://www.npmjs. com/package/hast-util-to-dom
223
217
224
- [ npm ] : https://docs.npmjs.com/cli/install
218
+ [ badge-size-image ] : https://img.shields.io/bundlejs/size/hast-util-to-dom
225
219
226
- [ esm ] : https://gist.github. com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
220
+ [ badge-size-url ] : https://bundlejs. com/?q=hast-util-to-dom
227
221
228
222
[ esmsh ] : https://esm.sh
229
223
230
- [ typescript ] : https://www.typescriptlang.org
224
+ [ file-license ] : license
231
225
232
- [ license ] : license
226
+ [ github-gist-esm ] : https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
233
227
234
- [ author ] : https://keith.mcknig.ht
228
+ [ github-hast ] : https://github.com/syntax-tree/hast
235
229
236
- [ health ] : https://github.com/syntax-tree/.github
237
-
238
- [ contributing ] : https://github.com/syntax-tree/.github/blob/main/contributing.md
230
+ [ github-hast-nodes ] : https://github.com/syntax-tree/hast#nodes
239
231
240
- [ support ] : https://github.com/syntax-tree/.github/blob/main/support.md
232
+ [ github-hast-util-from-dom ] : https://github.com/syntax-tree/hast-util-from-dom
241
233
242
- [ coc ] : https://github.com/syntax-tree/.github/blob/main/code-of-conduct.md
234
+ [ github-hast-util-sanitize ] : https://github.com/syntax-tree/hast-util-sanitize
243
235
244
- [ xss ] : https://en.wikipedia.org/wiki/Cross-site_scripting
236
+ [ github-jsdom ] : https://github.com/jsdom/jsdom
245
237
246
- [ hast-util-sanitize ] : https://github.com/syntax- tree/hast-util-sanitize
238
+ [ github-rehype-dom-stringify ] : https://github.com/rehypejs/rehype-dom/ tree/main/packages/rehype-dom-stringify
247
239
248
- [ hast-util-from-dom ] : https://github.com/syntax-tree/hast-util-from-dom
240
+ [ health ] : https://github.com/syntax-tree/.github
249
241
250
- [ jsdom ] : https://github.com/jsdom/jsdom
242
+ [ health-coc ] : https://github.com/syntax-tree/.github/blob/main/code-of-conduct.md
251
243
252
- [ rehype-dom-stringify ] : https://github.com/rehypejs/rehype-dom/ tree/main/packages/rehype-dom-stringify
244
+ [ health-contributing ] : https://github.com/syntax- tree/.github/blob/main/contributing.md
253
245
254
- [ hast ] : https://github.com/syntax-tree/hast
246
+ [ health-support ] : https://github.com/syntax-tree/.github/blob/main/support.md
255
247
256
- [ hast-node ] : https://github.com/syntax-tree/hast#nodes
248
+ [ mcknight ] : https://keith.mcknig.ht
257
249
258
- [ dom ] : https://developer.mozilla.org/docs/Web/API/Document_Object_Model
250
+ [ mozilla- dom] : https://developer.mozilla.org/docs/Web/API/Document_Object_Model
259
251
260
- [ dom-node ] : https://developer.mozilla.org/docs/Web/API/Node
252
+ [ mozilla- dom-node] : https://developer.mozilla.org/docs/Web/API/Node
261
253
262
- [ api-to-dom ] : #todomtree-options
254
+ [ npmjs-install ] : https://docs.npmjs.com/cli/install
263
255
264
- [ api-after-transform ] : #aftertransform
256
+ [ typescript ] : https://www.typescriptlang.org
265
257
266
- [ api-options ] : #options
258
+ [ wikipedia-xss ] : https://en.wikipedia.org/wiki/Cross-site_scripting
0 commit comments