From bfa399d72557f5c2fcda209a3433d01733a3c978 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alexandru=20M=C4=83r=C4=83=C8=99teanu?= <hello@alexei.ro>
Date: Sat, 8 Nov 2025 09:14:28 +0000
Subject: [PATCH] fix(docs): initialise data, fix typo in x-on example

---
 packages/docs/src/en/directives/on.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/docs/src/en/directives/on.md b/packages/docs/src/en/directives/on.md
index 7ccf7a0ec..b01747dc7 100644
--- a/packages/docs/src/en/directives/on.md
+++ b/packages/docs/src/en/directives/on.md
@@ -113,8 +113,9 @@ Here's an example of a button that changes behaviour when the `Shift` key is hel
 
 ```alpine
 <button type="button"
+    x-data="{ message: 'select' }"
     @click="message = 'selected'"
-    @click.shift="message = 'added to selection'">
+    @click.shift="message = 'added to selection'"
     @mousemove.shift="message = 'add to selection'"
     @mouseout="message = 'select'"
     x-text="message"></button>
@@ -124,6 +125,7 @@ Here's an example of a button that changes behaviour when the `Shift` key is hel
 <div class="demo">
     <div x-data="{ message: '' }">
         <button type="button"
+            x-data="{ message: 'select' }"
             @click="message = 'selected'"
             @click.shift="message = 'added to selection'"
             @mousemove.shift="message = 'add to selection'"