Capítulo 25 de 29

Chapter 25: React API Reference

Core Idea

The React adapter's public surface is small: useForm (returns an extended FormApi), useField (returns a FieldApi, imperative alternative to form.Field), the Field component itself, and two supporting types (FieldComponent, UseField) for typing custom wrappers.

Reference Tables

ExportKindPurpose
useForm(opts?)HookCreates a ReactFormExtendedApi — the form instance; wraps core FormApi with React-specific extras (Field component bound to it, etc.)
useField(opts)HookImperative field access outside a form.Field render-prop — returns a FieldApi directly
FieldComponentFunction component taking field options + a children render function; the render-prop entry point used throughout this skill
FieldComponentTypeType alias for the shape of a custom field component built to accept the same props as Field
UseFieldTypeType alias for a custom hook shaped like useField

Key Concepts

  • useForm's return type (ReactFormExtendedApi) is a superset of the framework-agnostic FormApi (ch026) — everything documented there (handleSubmit, setFieldValue, array mutators, etc.) is available on the object useForm returns, plus the React-bound Field component and Subscribe component.
  • useField exists for cases where the render-prop pattern of form.Field doesn't fit (e.g. building a fully custom hook-based field abstraction) — most application code uses form.Field instead (ch006).
  • FieldComponent/UseField are typing utilities for library/design-system authors building their own field abstractions on top of these primitives — see ch020's createFormHook for the higher-level, more commonly used composition tool.

Key Takeaways

  1. useForm's return value already contains everything from FieldApi/FormApi core (ch026) — you rarely need to import from the core package directly in a React app.
  2. Reach for useField only when form.Field's render-prop shape genuinely doesn't fit your abstraction — for typical apps, createFormHook (ch020) is the recommended way to build reusable field components, not raw useField.
  3. FieldComponent/UseField are typing-only exports for authors of custom field abstractions, not something most application code imports.

Connects To

  • Ch026 Field & Form API Classes: the framework-agnostic FormApi/FieldApi this adapter extends.
  • Ch020 Form Composition: the higher-level createFormHook pattern most teams should reach for instead of raw useField.
  • Ch029 Framework Adapters: how Vue/Solid/etc. expose the equivalent surface.