From 5192cbfce37d470346d3a9e216849118c3221c5e Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Sat, 15 Jan 2022 17:46:30 +0100
Subject: [PATCH] Add documentation

---
 site/content/docs/02-template-syntax.md | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/site/content/docs/02-template-syntax.md b/site/content/docs/02-template-syntax.md
index a17314f27f..d9e7337dea 100644
--- a/site/content/docs/02-template-syntax.md
+++ b/site/content/docs/02-template-syntax.md
@@ -1697,6 +1697,25 @@ All except `scrollX` and `scrollY` are readonly.
 
 > Note that the page will not be scrolled to the initial value to avoid accessibility issues. Only subsequent changes to the bound variable of `scrollX` and `scrollY` will cause scrolling. However, if the scrolling behaviour is desired, call `scrollTo()` in `onMount()`.
 
+### `<svelte:document>`
+
+```sv
+<svelte:document on:event={handler}/>
+```
+
+---
+
+Similarly to `<svelte:window>`, this element allows you to add listeners to events on `document`, such as `visibilitychange`, which don't fire on `window`. It also lets you use [actions](/docs#template-syntax-element-directives-use-action) on `document`.
+
+`<svelte:document>` also has to appear at the top level of your component.
+
+```sv
+<svelte:document
+	on:visibilitychange={handleVisibilityChange}
+	use:someAction
+/>
+```
+
 ### `<svelte:body>`
 
 ```sv