fix: correct a whole bunch of bad refs/types

TanStack · Jan 10, 2025 · 5b87ca5 · 5b87ca5
1 parent 3bd7f33
commit 5b87ca5
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 7 deletions.
diff --git a/packages/svelte-form/src/Field.svelte b/packages/svelte-form/src/Field.svelte
@@ -12,6 +12,7 @@
   import type { Snippet } from 'svelte';
   // TODO (43081j): somehow remove this circular reference
   import { createField } from './createField.svelte.js';
+  import type { FieldOptions } from '@tanstack/form-core';
 
   type Props = {
     children: Snippet<[
@@ -23,8 +24,7 @@
         TData
       >
     ]>
-    [key: string]: unknown;
-  } & FieldApiOptions<
+  } & FieldOptions<
     TParentData,
     TName,
     TFieldValidator,

diff --git a/packages/svelte-form/src/createField.svelte.ts b/packages/svelte-form/src/createField.svelte.ts
@@ -96,5 +96,5 @@ export function createField<
     api.update(opts())
   })
 
-  return () => extendedApi
+  return extendedApi
 }
diff --git a/packages/svelte-form/tests/simple.svelte b/packages/svelte-form/tests/simple.svelte
@@ -41,6 +41,7 @@ const form = createForm(() => ({
 
   <form.Field
     name="firstName"
+    form={form}
     validators={{
       onChange: ({ value }) =>
         value.length < 3 ? 'Not long enough' : undefined,
@@ -65,6 +66,7 @@ const form = createForm(() => ({
   </form.Field>
   <form.Field
     name="lastName"
+    form={form}
     validators={{
       onChange: ({ value }) =>
         value.length < 3 ? 'Not long enough' : undefined,
@@ -89,6 +91,7 @@ const form = createForm(() => ({
   </form.Field>
   <form.Field
     name="color"
+    form={form}
   >
     {#snippet children(field)}
       <div>
@@ -112,6 +115,7 @@ const form = createForm(() => ({
   </form.Field>
   <form.Field
     name="employed"
+    form={form}
   >
     {#snippet children(field)}
       <div>
@@ -157,19 +161,19 @@ const form = createForm(() => ({
   <div>
     <button
       type="submit"
-      disabled={form.api.state.isSubmitting}
+      disabled={form.state.isSubmitting}
     >
-      {form.api.state.isSubmitting ? html` Submitting` : 'Submit'}
+      {form.state.isSubmitting ? html` Submitting` : 'Submit'}
     </button>
     <button
       type="button"
       id="reset"
       on:click={() => {
-        form.api.reset()
+        form.reset()
       }}
     >
       Reset
     </button>
   </div>
 </form>
-<pre>{JSON.stringify(form.api.state, null, 2)}</pre>
+<pre>{JSON.stringify(form.state, null, 2)}</pre>