Skip to content

Commit 106789f

Browse files
committed
chore: fix remix and start
1 parent 4bf648a commit 106789f

File tree

8 files changed

+193
-31
lines changed

8 files changed

+193
-31
lines changed

examples/react/remix/app/routes/_index/route.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import {
66
formOptions,
77
mergeForm,
88
useForm,
9-
useTransform,
9+
useMerge,
1010
} from '@tanstack/react-form-remix'
1111
import { useStore } from '@tanstack/react-store'
1212

@@ -56,11 +56,14 @@ export default function Index() {
5656

5757
const form = useForm({
5858
...formOpts,
59-
transform: useTransform(
60-
(baseForm) => mergeForm(baseForm, actionData ?? {}),
61-
[actionData],
62-
),
6359
})
60+
61+
useMerge({
62+
form,
63+
fn: (baseForm) => mergeForm(baseForm, actionData ?? {}),
64+
deps: [actionData],
65+
})
66+
6467
const formErrors = useStore(form.store, (formState) => formState.errors)
6568

6669
return (

examples/react/tanstack-start/src/routes/index.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createFileRoute } from '@tanstack/react-router'
2-
import { mergeForm, useForm, useTransform } from '@tanstack/react-form-start'
2+
import { mergeForm, useForm, useMerge } from '@tanstack/react-form-start'
33
import { useStore } from '@tanstack/react-store'
44
import { getFormDataFromServer, handleForm } from 'src/utils/form'
55
import { formOpts } from 'src/utils/form-isomorphic'
@@ -16,7 +16,12 @@ function Home() {
1616

1717
const form = useForm({
1818
...formOpts,
19-
transform: useTransform((baseForm) => mergeForm(baseForm, state), [state]),
19+
})
20+
21+
useMerge({
22+
form,
23+
fn: (baseForm) => mergeForm(baseForm, state),
24+
deps: [state],
2025
})
2126

2227
const formErrors = useStore(form.store, (formState) => formState.errors)

packages/react-form-remix/src/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@ export * from '@tanstack/react-form'
22

33
export * from './createServerValidate'
44
export * from './error'
5-
export * from './useTransform'
5+
export * from './useMerge'
Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
import { mergeAndUpdate, useIsomorphicLayoutEffect } from '@tanstack/react-form'
2+
import type {
3+
FormApi,
4+
FormAsyncValidateOrFn,
5+
FormTransform,
6+
FormValidateOrFn,
7+
} from '@tanstack/react-form'
8+
9+
interface UseMergeOptions<
10+
TFormData,
11+
TOnMount extends undefined | FormValidateOrFn<TFormData>,
12+
TOnChange extends undefined | FormValidateOrFn<TFormData>,
13+
TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
14+
TOnBlur extends undefined | FormValidateOrFn<TFormData>,
15+
TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
16+
TOnSubmit extends undefined | FormValidateOrFn<TFormData>,
17+
TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
18+
TOnDynamic extends undefined | FormValidateOrFn<TFormData>,
19+
TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
20+
TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
21+
TSubmitMeta = never,
22+
> {
23+
form: FormApi<
24+
TFormData,
25+
TOnMount,
26+
TOnChange,
27+
TOnChangeAsync,
28+
TOnBlur,
29+
TOnBlurAsync,
30+
TOnSubmit,
31+
TOnSubmitAsync,
32+
TOnDynamic,
33+
TOnDynamicAsync,
34+
TOnServer,
35+
TSubmitMeta
36+
>
37+
fn?: FormTransform<
38+
TFormData,
39+
TOnMount,
40+
TOnChange,
41+
TOnChangeAsync,
42+
TOnBlur,
43+
TOnBlurAsync,
44+
TOnSubmit,
45+
TOnSubmitAsync,
46+
TOnDynamic,
47+
TOnDynamicAsync,
48+
TOnServer,
49+
TSubmitMeta
50+
>
51+
deps: unknown[]
52+
}
53+
54+
export function useMerge<
55+
TFormData,
56+
TOnMount extends undefined | FormValidateOrFn<TFormData>,
57+
TOnChange extends undefined | FormValidateOrFn<TFormData>,
58+
TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
59+
TOnBlur extends undefined | FormValidateOrFn<TFormData>,
60+
TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
61+
TOnSubmit extends undefined | FormValidateOrFn<TFormData>,
62+
TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
63+
TOnDynamic extends undefined | FormValidateOrFn<TFormData>,
64+
TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
65+
TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
66+
TSubmitMeta = never,
67+
>({
68+
form,
69+
fn,
70+
deps,
71+
}: UseMergeOptions<
72+
TFormData,
73+
TOnMount,
74+
TOnChange,
75+
TOnChangeAsync,
76+
TOnBlur,
77+
TOnBlurAsync,
78+
TOnSubmit,
79+
TOnSubmitAsync,
80+
TOnDynamic,
81+
TOnDynamicAsync,
82+
TOnServer,
83+
TSubmitMeta
84+
>) {
85+
useIsomorphicLayoutEffect(() => {
86+
mergeAndUpdate(form, fn)
87+
}, deps)
88+
}

packages/react-form-remix/src/useTransform.ts

Lines changed: 0 additions & 11 deletions
This file was deleted.

packages/react-form-start/src/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@ export * from '@tanstack/react-form'
33
export * from './createServerValidate'
44
export * from './getFormData'
55
export * from './error'
6-
export * from './useTransform'
6+
export * from './useMerge'
Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
import { mergeAndUpdate, useIsomorphicLayoutEffect } from '@tanstack/react-form'
2+
import type {
3+
FormApi,
4+
FormAsyncValidateOrFn,
5+
FormTransform,
6+
FormValidateOrFn,
7+
} from '@tanstack/react-form'
8+
9+
interface UseMergeOptions<
10+
TFormData,
11+
TOnMount extends undefined | FormValidateOrFn<TFormData>,
12+
TOnChange extends undefined | FormValidateOrFn<TFormData>,
13+
TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
14+
TOnBlur extends undefined | FormValidateOrFn<TFormData>,
15+
TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
16+
TOnSubmit extends undefined | FormValidateOrFn<TFormData>,
17+
TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
18+
TOnDynamic extends undefined | FormValidateOrFn<TFormData>,
19+
TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
20+
TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
21+
TSubmitMeta = never,
22+
> {
23+
form: FormApi<
24+
TFormData,
25+
TOnMount,
26+
TOnChange,
27+
TOnChangeAsync,
28+
TOnBlur,
29+
TOnBlurAsync,
30+
TOnSubmit,
31+
TOnSubmitAsync,
32+
TOnDynamic,
33+
TOnDynamicAsync,
34+
TOnServer,
35+
TSubmitMeta
36+
>
37+
fn?: FormTransform<
38+
TFormData,
39+
TOnMount,
40+
TOnChange,
41+
TOnChangeAsync,
42+
TOnBlur,
43+
TOnBlurAsync,
44+
TOnSubmit,
45+
TOnSubmitAsync,
46+
TOnDynamic,
47+
TOnDynamicAsync,
48+
TOnServer,
49+
TSubmitMeta
50+
>
51+
deps: unknown[]
52+
}
53+
54+
export function useMerge<
55+
TFormData,
56+
TOnMount extends undefined | FormValidateOrFn<TFormData>,
57+
TOnChange extends undefined | FormValidateOrFn<TFormData>,
58+
TOnChangeAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
59+
TOnBlur extends undefined | FormValidateOrFn<TFormData>,
60+
TOnBlurAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
61+
TOnSubmit extends undefined | FormValidateOrFn<TFormData>,
62+
TOnSubmitAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
63+
TOnDynamic extends undefined | FormValidateOrFn<TFormData>,
64+
TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
65+
TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
66+
TSubmitMeta = never,
67+
>({
68+
form,
69+
fn,
70+
deps,
71+
}: UseMergeOptions<
72+
TFormData,
73+
TOnMount,
74+
TOnChange,
75+
TOnChangeAsync,
76+
TOnBlur,
77+
TOnBlurAsync,
78+
TOnSubmit,
79+
TOnSubmitAsync,
80+
TOnDynamic,
81+
TOnDynamicAsync,
82+
TOnServer,
83+
TSubmitMeta
84+
>) {
85+
useIsomorphicLayoutEffect(() => {
86+
mergeAndUpdate(form, fn)
87+
}, deps)
88+
}

packages/react-form-start/src/useTransform.ts

Lines changed: 0 additions & 11 deletions
This file was deleted.

0 commit comments

Comments
 (0)