diff --git a/docs/overview.md b/docs/overview.md index 4ec9e64172..5a85cfb25b 100644 --- a/docs/overview.md +++ b/docs/overview.md @@ -88,7 +88,8 @@ export default function App() { triggerDebounceMs: 500, }, ]} - children={(field) => { + > + {(field) => { // Avoid hasty abstractions. Render props are great! return ( <> @@ -104,12 +105,11 @@ export default function App() { ) }} - /> +
- ( + + {(field) => ( <> )} - /> +
[state.canSubmit, state.isSubmitting]} - children={([canSubmit, isSubmitting]) => ( + > + {([canSubmit, isSubmitting]) => ( <> )} - /> + ) diff --git a/examples/react/compiler/src/index.tsx b/examples/react/compiler/src/index.tsx index 97af96a277..c891059331 100644 --- a/examples/react/compiler/src/index.tsx +++ b/examples/react/compiler/src/index.tsx @@ -64,7 +64,8 @@ export default function App() { triggerDebounceMs: 500, }, ]} - children={(field) => { + > + {(field) => { // Avoid hasty abstractions. Render props are great! return ( <> @@ -80,12 +81,11 @@ export default function App() { ) }} - /> +
- ( + + {(field) => ( <> )} - /> +
[state.canSubmit, state.isSubmitting]} - children={([canSubmit, isSubmitting]) => ( + > + {([canSubmit, isSubmitting]) => ( <> )} - /> + ) diff --git a/examples/react/large-form/src/features/people/address-fields.tsx b/examples/react/large-form/src/features/people/address-fields.tsx index 4d4a0c6866..3be1e4134f 100644 --- a/examples/react/large-form/src/features/people/address-fields.tsx +++ b/examples/react/large-form/src/features/people/address-fields.tsx @@ -9,26 +9,21 @@ export function AddressFields({ form }: AddressFieldsProps) { return (

Address

- } - /> - } - /> - } - /> - } - /> - } - /> + + {(field) => } + + + {(field) => } + + + {(field) => } + + + {(field) => } + + + {(field) => } +
) } diff --git a/examples/react/large-form/src/features/people/emergency-contact.tsx b/examples/react/large-form/src/features/people/emergency-contact.tsx index 4d110239f1..8b7c0a23d2 100644 --- a/examples/react/large-form/src/features/people/emergency-contact.tsx +++ b/examples/react/large-form/src/features/people/emergency-contact.tsx @@ -12,14 +12,12 @@ function EmergencyContactFields({ }) { return ( <> - } - /> - } - /> + + {(field) => } + + + {(field) => } + ) } diff --git a/examples/react/large-form/src/features/people/page.tsx b/examples/react/large-form/src/features/people/page.tsx index 3bf6e465ef..cfa28db97b 100644 --- a/examples/react/large-form/src/features/people/page.tsx +++ b/examples/react/large-form/src/features/people/page.tsx @@ -19,18 +19,15 @@ export const PeoplePage = () => { }} >

Personal Information

- } - /> - } - /> - } - /> + + {(field) => } + + + {(field) => } + + + {(field) => } +

Emergency Contact

[state.canSubmit, state.isSubmitting]} - children={([canSubmit, isSubmitting]) => ( + > + {([canSubmit, isSubmitting]) => ( <> )} - /> + ) diff --git a/examples/react/simple/src/index.tsx b/examples/react/simple/src/index.tsx index f0b6d3d483..dec6bcd0c1 100644 --- a/examples/react/simple/src/index.tsx +++ b/examples/react/simple/src/index.tsx @@ -66,7 +66,8 @@ export default function App() { triggerDebounceMs: 500, }, ]} - children={(field) => { + > + {(field) => { // Avoid hasty abstractions. Render props are great! return ( <> @@ -82,12 +83,11 @@ export default function App() { ) }} - /> +
- ( + + {(field) => ( <> )} - /> +
[state.canSubmit, state.isSubmitting]} - children={([canSubmit, isSubmitting]) => ( + > + {([canSubmit, isSubmitting]) => ( <> )} - /> + ) diff --git a/examples/react/standard-schema/src/index.tsx b/examples/react/standard-schema/src/index.tsx index a3eb8ce770..2f18bd6cfb 100644 --- a/examples/react/standard-schema/src/index.tsx +++ b/examples/react/standard-schema/src/index.tsx @@ -99,9 +99,8 @@ export default function App() { >
{/* A type-safe field component*/} - { + + {(field) => { // Avoid hasty abstractions. Render props are great! return ( <> @@ -117,12 +116,11 @@ export default function App() { ) }} - /> +
- ( + + {(field) => ( <> )} - /> +
[state.canSubmit, state.isSubmitting]} - children={([canSubmit, isSubmitting]) => ( + > + {([canSubmit, isSubmitting]) => ( )} - /> + )