From d35db4cfba02d14ff2b0f58760524f2655fc81a5 Mon Sep 17 00:00:00 2001
From: Nayan Gautam <50981692+698969@users.noreply.github.com>
Date: Tue, 30 Nov 2021 11:47:22 +0545
Subject: [PATCH] Inline outclick handlers

---
 site/content/examples/13-actions/00-actions/App.svelte      | 6 +-----
 .../content/tutorial/12-actions/01-actions/app-a/App.svelte | 6 +-----
 .../content/tutorial/12-actions/01-actions/app-b/App.svelte | 6 +-----
 site/content/tutorial/12-actions/01-actions/text.md         | 2 +-
 4 files changed, 4 insertions(+), 16 deletions(-)

diff --git a/site/content/examples/13-actions/00-actions/App.svelte b/site/content/examples/13-actions/00-actions/App.svelte
index 72740cf796..313daa580c 100644
--- a/site/content/examples/13-actions/00-actions/App.svelte
+++ b/site/content/examples/13-actions/00-actions/App.svelte
@@ -2,15 +2,11 @@
 	import { clickOutside } from "./click_outside.js";
 
 	let showModal = true;
-
-	function handleOutclick(){
-		showModal = false;
-	}
 </script>
 
 <button on:click={() => (showModal = true)}>Show Modal</button>
 {#if showModal}
-	<div class="box" use:clickOutside on:outclick={handleOutclick}>
+	<div class="box" use:clickOutside on:outclick={() => (showModal = false)}>
 		Click outside me!
 	</div>
 {/if}
diff --git a/site/content/tutorial/12-actions/01-actions/app-a/App.svelte b/site/content/tutorial/12-actions/01-actions/app-a/App.svelte
index b7d8f39c3b..dac7724af2 100644
--- a/site/content/tutorial/12-actions/01-actions/app-a/App.svelte
+++ b/site/content/tutorial/12-actions/01-actions/app-a/App.svelte
@@ -2,10 +2,6 @@
 
 	
 	let showModal = true;
-
-	function handleOutclick(){
-		showModal = false;
-	}
 </script>
 
 <style>
@@ -27,7 +23,7 @@
 
 <button on:click={() => (showModal = true)}>Show Modal</button>
 {#if showModal}
-	<div class="box" on:outclick={handleOutclick}>
+	<div class="box" on:outclick={() => (showModal = false)}>
 		Click outside me!
 	</div>
 {/if}
\ No newline at end of file
diff --git a/site/content/tutorial/12-actions/01-actions/app-b/App.svelte b/site/content/tutorial/12-actions/01-actions/app-b/App.svelte
index 6b1cd7a55b..e503f98589 100644
--- a/site/content/tutorial/12-actions/01-actions/app-b/App.svelte
+++ b/site/content/tutorial/12-actions/01-actions/app-b/App.svelte
@@ -2,10 +2,6 @@
 	import { clickOutside } from "./click_outside.js";
 
 	let showModal = true;
-
-	function handleOutclick(){
-		showModal = false;
-	}
 </script>
 
 <style>
@@ -27,7 +23,7 @@
 
 <button on:click={() => (showModal = true)}>Show Modal</button>
 {#if showModal}
-	<div class="box" use:clickOutside on:outclick={handleOutclick}>
+	<div class="box" use:clickOutside on:outclick={() => (showModal = false)}>
 		Click outside me!
 	</div>
 {/if}
\ No newline at end of file
diff --git a/site/content/tutorial/12-actions/01-actions/text.md b/site/content/tutorial/12-actions/01-actions/text.md
index 0cbbb40a81..dfe75c192f 100644
--- a/site/content/tutorial/12-actions/01-actions/text.md
+++ b/site/content/tutorial/12-actions/01-actions/text.md
@@ -18,7 +18,7 @@ import { clickOutside } from "./click_outside.js";
 ...then use it with the element:
 
 ```html
-<div class="box" use:clickOutside on:outclick="{handleOutclick}">
+<div class="box" use:clickOutside on:outclick="{() => (showModal = false)}">
 	Click outside me!
 </div>
 ```