From d908b682325b93d8d61c86ab0b8ee7eedf87dab2 Mon Sep 17 00:00:00 2001
From: Scott Wu <sw@scottwu.ca>
Date: Mon, 29 Jun 2026 06:53:58 +0800
Subject: [PATCH 1/2] Enhance documentation with Svelte examples

Added examples for dynamic tags and comments in Svelte.
---
 .../03-template-syntax/01-basic-markup.md     | 24 ++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/documentation/docs/03-template-syntax/01-basic-markup.md b/documentation/docs/03-template-syntax/01-basic-markup.md
index feecfe033e..167ed312b9 100644
--- a/documentation/docs/03-template-syntax/01-basic-markup.md
+++ b/documentation/docs/03-template-syntax/01-basic-markup.md
@@ -18,6 +18,19 @@ A lowercase tag, like `<div>`, denotes a regular HTML element. A capitalised tag
 </div>
 ```
 
+Svelte safely omits dynamic tags if the resolved property is `null` or `undefined`, but it expects the object path to be valid object.
+
+```svelte
+<script>
+	let Widget = $state(null)
+    let child = $state({ widget: null })
+</script>
+
+<Widget />
+<child.widget />
+```
+
+
 ## Element attributes
 
 By default, attributes work exactly like their HTML counterparts.
@@ -180,12 +193,21 @@ The expression will be stringified and escaped to prevent code injections. If yo
 
 ## Comments
 
-You can use HTML comments inside components.
+You can use HTML comments inside components and inside tags.
 
 ```svelte
 <!-- this is a comment! --><h1>Hello world</h1>
 ```
 
+```svelte
+<div
+  // this is a comment!
+  data-foo="bar"
+>
+  foo bar
+</div>
+```
+
 Comments beginning with `svelte-ignore` disable warnings for the next block of markup. Usually, these are accessibility warnings; make sure that you're disabling them for a good reason.
 
 ```svelte

From 13987a5d9ca462732b30706e3347f48828d28f9d Mon Sep 17 00:00:00 2001
From: Scott Wu <sw@scottwu.ca>
Date: Mon, 29 Jun 2026 07:01:14 +0800
Subject: [PATCH 2/2] Update Svelte dynamic tags explanation

Clarified the behavior of Svelte regarding dynamic tags.
---
 documentation/docs/03-template-syntax/01-basic-markup.md | 4 ++--
 1 file changed, 2 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 167ed312b9..faf88a5e0e 100644
--- a/documentation/docs/03-template-syntax/01-basic-markup.md
+++ b/documentation/docs/03-template-syntax/01-basic-markup.md
@@ -18,12 +18,12 @@ A lowercase tag, like `<div>`, denotes a regular HTML element. A capitalised tag
 </div>
 ```
 
-Svelte safely omits dynamic tags if the resolved property is `null` or `undefined`, but it expects the object path to be valid object.
+Svelte will omit tags if the leaf property is `null` or `undefined`.
 
 ```svelte
 <script>
 	let Widget = $state(null)
-    let child = $state({ widget: null })
+	let child = $state({ widget: null })
 </script>
 
 <Widget />