From 50c54869faa31a7149cdc57c97e5cf3dacad1fd7 Mon Sep 17 00:00:00 2001
From: Andrew Brown <browner12@gmail.com>
Date: Tue, 8 Aug 2023 15:40:34 -0500
Subject: [PATCH] clarify execution order of `init`

there are multiple ways to run code on Alpine initialization, so this clarifies the order of execution of the object `init()` method vs the `x-init` directive.
---
 packages/docs/src/en/directives/init.md | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/packages/docs/src/en/directives/init.md b/packages/docs/src/en/directives/init.md
index 9e4d2eb87..2a3983a15 100644
--- a/packages/docs/src/en/directives/init.md
+++ b/packages/docs/src/en/directives/init.md
@@ -72,3 +72,18 @@ Alpine.data('dropdown', () => ({
     },
 }))
 ```
+
+If you have both an `x-data` object containing an `init()` method and an `x-init` directive, the `x-data` method will be called before the directive.
+
+```alpine
+<div
+    x-data="{
+        init() {
+            console.log('I am called first')
+        }
+    }"
+    x-init="console.log('I am called second')"
+    >
+    ...
+</div>
+```