refactor(FormComponent): use snippet for form children

Refactor Defaults.svelte to wrap form fields in a snippet block, passing errors and isDirty to children. This improves code clarity and aligns with updated component patterns.

Author: brodienguyen

packages/svelte5/test-app/Pages/FormComponent/SubmitComplete/Defaults.svelte

@@ -5,27 +5,29 @@
 <div>
   <h1>OnSubmitComplete Defaults Test</h1>
 
-  <Form method="post" let:errors let:isDirty onSubmitComplete={(props) => props.defaults()}>
-    <div>
-      <p id="dirty-status">{isDirty ? 'Form is dirty' : 'Form is clean'}</p>
-    </div>
+  <Form method="post" onSubmitComplete={(props) => props.defaults()}>
+    {#snippet children({ errors, isDirty })}
+      <div>
+        <p id="dirty-status">{isDirty ? 'Form is dirty' : 'Form is clean'}</p>
+      </div>
 
-    <div>
-      <input type="text" name="name" id="name" placeholder="Name" value="John Doe" />
-      {#if errors.name}
-        <p id="error_name">{errors.name}</p>
-      {/if}
-    </div>
+      <div>
+        <input type="text" name="name" id="name" placeholder="Name" value="John Doe" />
+        {#if errors.name}
+          <p id="error_name">{errors.name}</p>
+        {/if}
+      </div>
 
-    <div>
-      <input type="email" name="email" id="email" placeholder="Email" value="[email protected]" />
-      {#if errors.email}
-        <p id="error_email">{errors.email}</p>
-      {/if}
-    </div>
+      <div>
+        <input type="email" name="email" id="email" placeholder="Email" value="[email protected]" />
+        {#if errors.email}
+          <p id="error_email">{errors.email}</p>
+        {/if}
+      </div>
 
-    <div>
-      <button type="submit">Submit</button>
-    </div>
+      <div>
+        <button type="submit">Submit</button>
+      </div>
+    {/snippet}
   </Form>
 </div>