From c55a72da9229be4458ac0da10a9af1ebeaf3e6c9 Mon Sep 17 00:00:00 2001
From: tglide <26071571+TGlide@users.noreply.github.com>
Date: Mon, 11 Mar 2024 23:33:27 +0000
Subject: [PATCH] update example

---
 .../content/functions/with-element-size.md    | 25 ++++---------------
 1 file changed, 5 insertions(+), 20 deletions(-)

diff --git a/sites/docs/content/functions/with-element-size.md b/sites/docs/content/functions/with-element-size.md
index 5d0e9611..04c5fbf0 100644
--- a/sites/docs/content/functions/with-element-size.md
+++ b/sites/docs/content/functions/with-element-size.md
@@ -15,30 +15,15 @@ import { WithElementSizeDemo } from '$lib/components/demos';
 
 ```svelte
 <script lang="ts">
+	<script lang="ts">
 	import { withElementSize } from "withrunes";
 
-	let count = $state(0);
-	let logged = $state("");
-	let isFirstTime = $state(true);
-
-	const logCount = withElementSize(() => {
-		if (isFirstTime) {
-			isFirstTime = false;
-			logged = `You pressed the button ${count} times!`;
-		} else {
-			logged = `You pressed the button ${count} times since last time!`;
-		}
-		count = 0;
-	}, 1000);
-
-	function ding() {
-		count++;
-		logCount();
-	}
+	let el: HTMLElement | undefined = $state(undefined);
+	const size = withElementSize(() => el);
 </script>
 
 <div>
-	<button onclick={ding}>DING DING DING</button>
-	<p>{logged || "Press the button!"}</p>
+	<textarea bind:this={el} />
+	<p>Width: {size.width} Height: {size.height}</p>
 </div>
 ```