+
+
+
\ No newline at end of file
diff --git a/site/content/tutorial/17-module-context/01-sharing-code/app-b/App.svelte b/site/content/tutorial/17-module-context/01-sharing-code/app-b/App.svelte
new file mode 100644
index 0000000000..3c0133350a
--- /dev/null
+++ b/site/content/tutorial/17-module-context/01-sharing-code/app-b/App.svelte
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/site/content/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte b/site/content/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte
new file mode 100644
index 0000000000..27dbe1993b
--- /dev/null
+++ b/site/content/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
{title}
+
{composer} / performed by {performer}
+
+
+
\ No newline at end of file
diff --git a/site/content/tutorial/17-module-context/01-sharing-code/text.md b/site/content/tutorial/17-module-context/01-sharing-code/text.md
new file mode 100644
index 0000000000..9081b18dce
--- /dev/null
+++ b/site/content/tutorial/17-module-context/01-sharing-code/text.md
@@ -0,0 +1,30 @@
+---
+title: Sharing code
+---
+
+In all the examples we've seen so far, the `
+```
+
+It's now possible for the components to 'talk' to each other without any state management:
+
+```js
+onMount(() => {
+ elements.add(audio);
+ return () => elements.delete(audio);
+});
+
+function stopOthers() {
+ elements.forEach(element => {
+ if (element !== audio) element.pause();
+ });
+}
+```
\ No newline at end of file
diff --git a/site/content/tutorial/17-module-context/02-module-exports/app-a/App.svelte b/site/content/tutorial/17-module-context/02-module-exports/app-a/App.svelte
new file mode 100644
index 0000000000..2d7d23412d
--- /dev/null
+++ b/site/content/tutorial/17-module-context/02-module-exports/app-a/App.svelte
@@ -0,0 +1,47 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/site/content/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte b/site/content/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte
new file mode 100644
index 0000000000..27dbe1993b
--- /dev/null
+++ b/site/content/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
{title}
+
{composer} / performed by {performer}
+
+
+
\ No newline at end of file
diff --git a/site/content/tutorial/17-module-context/02-module-exports/app-b/App.svelte b/site/content/tutorial/17-module-context/02-module-exports/app-b/App.svelte
new file mode 100644
index 0000000000..cd5ab44b21
--- /dev/null
+++ b/site/content/tutorial/17-module-context/02-module-exports/app-b/App.svelte
@@ -0,0 +1,47 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/site/content/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte b/site/content/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte
new file mode 100644
index 0000000000..4e3d191dbf
--- /dev/null
+++ b/site/content/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte
@@ -0,0 +1,52 @@
+
+
+
+
+
+
+
+
{title}
+
{composer} / performed by {performer}
+
+
+
\ No newline at end of file
diff --git a/site/content/tutorial/17-module-context/02-module-exports/text.md b/site/content/tutorial/17-module-context/02-module-exports/text.md
new file mode 100644
index 0000000000..d5b4b96621
--- /dev/null
+++ b/site/content/tutorial/17-module-context/02-module-exports/text.md
@@ -0,0 +1,35 @@
+---
+title: Exports
+---
+
+Anything exported from a `context="module"` script block becomes an export from the module itself. If we export a `stopAll` function from `AudioPlayer.svelte`...
+
+```html
+
+```
+
+...we can then import it from `App.svelte`...
+
+```html
+
+```
+
+...and use it in an event handler:
+
+```html
+
+```
+
+> You can't have a default export, because the component *is* the default export.
\ No newline at end of file
diff --git a/site/content/tutorial/17-module-context/meta.json b/site/content/tutorial/17-module-context/meta.json
new file mode 100644
index 0000000000..1a8720e2ce
--- /dev/null
+++ b/site/content/tutorial/17-module-context/meta.json
@@ -0,0 +1,3 @@
+{
+ "title": "Module context"
+}
\ No newline at end of file
diff --git a/site/content/tutorial/99-todo/99-todo/text.md b/site/content/tutorial/99-todo/99-todo/text.md
index b9d949e11f..d0eddbaa1f 100644
--- a/site/content/tutorial/99-todo/99-todo/text.md
+++ b/site/content/tutorial/99-todo/99-todo/text.md
@@ -68,8 +68,8 @@ Another one should cover how to set up an editor for syntax highlighting.
* [x] deep/contextual bindings
* [x] Dimensions
* [x] `this`
-* [ ] shorthand
-* [ ] component bindings
+* [x] shorthand
+* [x] component bindings
Maybe lifecycle should go first, since we're using `onMount` in the `this` demo?
@@ -98,7 +98,7 @@ Maybe lifecycle should go first, since we're using `onMount` in the `this` demo?
* [x] `onDestroy`
* [x] `beforeUpdate`
* [x] `afterUpdate`
-* [ ] how lifecycle functions behave in SSR mode?
+* [x] how lifecycle functions behave in SSR mode?
## Transitions
@@ -147,18 +147,17 @@ Maybe lifecycle should go first, since we're using `onMount` in the `this` demo?
* [x] ``
* [x] ``
* [x] ``
+* [ ] ``
-## Miscellaneous
+## Module context
-* [ ] Debug tags
-* [ ] `context="module"`
-* [ ] `tick`
+* [x] sharing code
+* [x] exports
----
+## Miscellaneous
-## Bugs etc
+* [ ] Debug tags
+* [ ] `tick`
-* 'Show me' should be greyed out if current state is identical to target state
-* Clicking 'Show me' shouldn't change the file you're looking at
\ No newline at end of file
diff --git a/site/static/tutorial/music/beethoven.mp3 b/site/static/tutorial/music/beethoven.mp3
new file mode 100644
index 0000000000..3bda3ae676
Binary files /dev/null and b/site/static/tutorial/music/beethoven.mp3 differ
diff --git a/site/static/tutorial/music/holst.mp3 b/site/static/tutorial/music/holst.mp3
new file mode 100644
index 0000000000..b1ba89f486
Binary files /dev/null and b/site/static/tutorial/music/holst.mp3 differ
diff --git a/site/static/tutorial/music/mozart.mp3 b/site/static/tutorial/music/mozart.mp3
new file mode 100644
index 0000000000..d9a2d2781f
Binary files /dev/null and b/site/static/tutorial/music/mozart.mp3 differ
diff --git a/site/static/tutorial/music/satie.mp3 b/site/static/tutorial/music/satie.mp3
new file mode 100644
index 0000000000..c2488d7bb4
Binary files /dev/null and b/site/static/tutorial/music/satie.mp3 differ
diff --git a/site/static/tutorial/music/strauss.mp3 b/site/static/tutorial/music/strauss.mp3
new file mode 100644
index 0000000000..db433dd35f
Binary files /dev/null and b/site/static/tutorial/music/strauss.mp3 differ