Skip to content

Commit 4558e61

Browse files
committed
Add improved docs
1 parent 9beb8ed commit 4558e61

File tree

1 file changed

+92
-27
lines changed

1 file changed

+92
-27
lines changed

readme.md

Lines changed: 92 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -8,19 +8,61 @@
88
[![Backers][backers-badge]][collective]
99
[![Chat][chat-badge]][chat]
1010

11-
[**hast**][hast] utility to sanitize a [*tree*][tree].
11+
[hast][] utility to make trees safe.
1212

13-
## Install
13+
## Contents
14+
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+
* [`sanitize(tree[, schema])`](#sanitizetree-schema)
21+
* [`Schema`](#schema)
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 that can make a tree that potentially contains
32+
dangerous user content safe for use.
33+
It defaults to what GitHub does to clean unsafe markup, but you can change that.
1434

15-
This package is [ESM only](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c):
16-
Node 12+ is needed to use it and it must be `import`ed instead of `require`d.
35+
## When should I use this?
1736

18-
[npm][]:
37+
This package is needed whenever you deal with potentially dangerous user
38+
content.
39+
40+
The plugin [`rehype-sanitize`][rehype-sanitize] wraps this utility to also
41+
sanitize HTML at a higher-level (easier) abstraction.
42+
43+
## Install
44+
45+
This package is [ESM only][esm].
46+
In Node.js (version 12.20+, 14.14+, 16.0+, or 18.0+), install with [npm][]:
1947

2048
```sh
2149
npm install hast-util-sanitize
2250
```
2351

52+
In Deno with [`esm.sh`][esmsh]:
53+
54+
```js
55+
import {sanitize} from 'https://esm.sh/hast-util-sanitize@4'
56+
```
57+
58+
In browsers with [`esm.sh`][esmsh]:
59+
60+
```html
61+
<script type="module">
62+
import {sanitize} from 'https://esm.sh/hast-util-sanitize@4?bundle'
63+
</script>
64+
```
65+
2466
## Use
2567

2668
```js
@@ -74,26 +116,28 @@ Sanitized:
74116

75117
## API
76118

77-
This package exports the following identifiers: `sanitize`, `defaultSchema`.
119+
This package exports the identifiers `sanitize` and `defaultSchema`.
78120
There is no default export.
79121

80122
### `sanitize(tree[, schema])`
81123

82-
Sanitize a [**hast**][hast] [*tree*][tree].
124+
Sanitize a tree.
83125

84126
###### Parameters
85127

86-
* `tree` ([`Node`][node]) — [*Tree*][tree] to sanitize
87-
* `schema` ([`Schema`][schema], optional) — Schema defining how to sanitize
128+
* `tree` ([`Node`][node]) — [*tree*][tree] to sanitize
129+
* `schema` ([`Schema`][schema], optional) — schema defining how to sanitize
88130

89131
###### Returns
90132

91-
[`Node`][node]A new, sanitized [*tree*][tree].
133+
A new, sanitized, tree ([`Node`][node]).
92134

93135
### `Schema`
94136

95-
Configuration.
96-
If not given, defaults to [GitHub][] style sanitation.
137+
Sanitation schema that defines if and how nodes and properties should be
138+
cleaned.
139+
The default schema is exported as `defaultSchema`, which defaults to [GitHub][]
140+
style sanitation.
97141
If any top-level key isn’t given, it defaults to GitHub’s style too.
98142

99143
For a thorough sample, see the code for [`defaultSchema`][default-schema].
@@ -102,12 +146,12 @@ To extend the standard schema with a few changes, clone `defaultSchema` like so:
102146

103147
```js
104148
import {h} from 'hastscript'
105-
import deepmerge from 'deepmerge'
149+
import deepmerge from 'deepmerge' // You can use `structuredClone` in modern JS.
106150
import {sanitize, defaultSchema} from 'hast-util-sanitize'
107151

108-
var schema = deepmerge(defaultSchema, {attributes: {'*': ['className']}})
152+
const schema = deepmerge(defaultSchema, {attributes: {'*': ['className']}})
109153

110-
var tree = sanitize(h('div', {className: ['foo']}), schema)
154+
const tree = sanitize(h('div', {className: ['foo']}), schema)
111155

112156
// `tree` still has `className`.
113157
console.log(tree)
@@ -127,7 +171,7 @@ Map of tag names to allowed [*property names*][name]
127171
The special `'*'` key defines [*property names*][name] allowed on all
128172
[*elements*][element].
129173

130-
One special value, namely `'data*'`, can be used to allow all `data` properties.
174+
One special value, `'data*'`, can be used to allow all `data` properties.
131175

132176
```js
133177
attributes: {
@@ -150,7 +194,6 @@ Instead of a single string (such as `type`), which allows any [*property
150194
value*][value] of that [*property name*][name], it’s also possible to provide
151195
an array (such as `['type', 'checkbox']`), where the first entry is the
152196
*property name*, and all other entries allowed *property values*.
153-
154197
This is how the default GitHub schema allows only disabled checkbox inputs:
155198

156199
```js
@@ -280,24 +323,36 @@ Whether to allow [*doctypes*][doctype] (`boolean`, default: `false`).
280323
allowDoctypes: true
281324
```
282325

326+
## Types
327+
328+
This package is fully typed with [TypeScript][].
329+
It exports the additional type `Schema`.
330+
331+
## Compatibility
332+
333+
Projects maintained by the unified collective are compatible with all maintained
334+
versions of Node.js.
335+
As of now, that is Node.js 12.20+, 14.14+, 16.0+, and 18.0+.
336+
Our projects sometimes work with older versions, but this is not guaranteed.
337+
283338
## Security
284339

285-
Improper use of `hast-util-sanitize` can open you up to a
340+
By default, `hast-util-sanitize` will make everything safe to use.
341+
But when used incorrectly, deviating from the defaults can open you up to a
286342
[cross-site scripting (XSS)][xss] attack.
287-
The defaults *are* safe, but deviating from them is likely *unsafe*.
288343

289-
Use `hast-util-sanitize` *after* all other utilities, as other utilities are
290-
likely also unsafe.
344+
Use `hast-util-sanitize` after the last unsafe thing: everything after it could
345+
be unsafe (but is fine if you do trust it).
291346

292347
## Related
293348

294349
* [`rehype-sanitize`](https://github.com/rehypejs/rehype-sanitize)
295-
[rehype](https://github.com/rehypejs/rehype) plugin wrapper
350+
— rehype plugin
296351

297352
## Contribute
298353

299-
See [`contributing.md` in `syntax-tree/.github`][contributing] for ways to get
300-
started.
354+
See [`contributing.md`][contributing] in [`rehypejs/.github`][health] for ways
355+
to get started.
301356
See [`support.md`][support] for ways to get help.
302357

303358
This project has a [code of conduct][coc].
@@ -338,15 +393,23 @@ abide by its terms.
338393

339394
[npm]: https://docs.npmjs.com/cli/install
340395

396+
[esm]: https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
397+
398+
[esmsh]: https://esm.sh
399+
400+
[typescript]: https://www.typescriptlang.org
401+
341402
[license]: license
342403

343404
[author]: https://wooorm.com
344405

345-
[contributing]: https://github.com/syntax-tree/.github/blob/HEAD/contributing.md
406+
[health]: https://github.com/syntax-tree/.github
407+
408+
[contributing]: https://github.com/syntax-tree/.github/blob/main/contributing.md
346409

347-
[support]: https://github.com/syntax-tree/.github/blob/HEAD/support.md
410+
[support]: https://github.com/syntax-tree/.github/blob/main/support.md
348411

349-
[coc]: https://github.com/syntax-tree/.github/blob/HEAD/code-of-conduct.md
412+
[coc]: https://github.com/syntax-tree/.github/blob/main/code-of-conduct.md
350413

351414
[tree]: https://github.com/syntax-tree/unist#tree
352415

@@ -377,3 +440,5 @@ abide by its terms.
377440
[default-schema]: lib/schema.js
378441

379442
[schema]: #schema
443+
444+
[rehype-sanitize]: https://github.com/rehypejs/rehype-sanitize

0 commit comments

Comments
 (0)