From cddf54504a907b2f42c10b188e2e5e9c8bcba42d Mon Sep 17 00:00:00 2001
From: Scott Wu <sw@scottwu.ca>
Date: Sat, 19 Apr 2025 14:45:08 +0800
Subject: [PATCH] Update 01-basic-markup.md

---
 .../03-template-syntax/01-basic-markup.md     | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/03-template-syntax/01-basic-markup.md b/documentation/docs/03-template-syntax/01-basic-markup.md
index fe5f8b02aae0..1156c3366636 100644
--- a/documentation/docs/03-template-syntax/01-basic-markup.md
+++ b/documentation/docs/03-template-syntax/01-basic-markup.md
@@ -82,12 +82,27 @@ As with elements, `name={name}` can be replaced with the `{name}` shorthand.
 <Widget foo={bar} answer={42} text="hello" />
 ```
 
-_Spread attributes_ allow many attributes or properties to be passed to an element or component at once.
+## Spreading
+
+_Spreading_ allow many attributes or properties to be passed to an element or component at once.
 
 An element or component can have multiple spread attributes, interspersed with regular ones.
 
 ```svelte
-<Widget {...things} />
+<button {...attributes}>...</button>
+<button {...attributes} type="button">...</button>
+<Widget {...props} />
+<Widget {...props} foo={bar} text="hello" {...aria} />
+```
+The order in which they are displayed matters
+
+```svelte
+<script>
+	const attributes = { type: "button" };
+</script>
+
+<button {...attributes} type="submit">...</button> <!-- type is "submit" -->
+<button type="submit" {...attributes}>...</button> <!-- type is "button" -->
 ```
 
 ## Events