Home / Function/ useFormField() — ui Function Reference

useFormField() — ui Function Reference

Architecture documentation for the useFormField() function in form.tsx from the ui codebase.

Entity Profile

Dependency Diagram

graph TD
  94429819_53f2_f220_12d8_b0229985d8e4["useFormField()"]
  26832279_f22a_39e6_9194_59ea47194309["form.tsx"]
  94429819_53f2_f220_12d8_b0229985d8e4 -->|defined in| 26832279_f22a_39e6_9194_59ea47194309
  f4e0d5d3_9509_e7b4_b483_1e99f02c7c1c["FormLabel()"]
  f4e0d5d3_9509_e7b4_b483_1e99f02c7c1c -->|calls| 94429819_53f2_f220_12d8_b0229985d8e4
  61f92fde_0d07_117d_b680_edeeef6f3826["FormControl()"]
  61f92fde_0d07_117d_b680_edeeef6f3826 -->|calls| 94429819_53f2_f220_12d8_b0229985d8e4
  df7b8a72_ee51_1783_1ce2_7ad74143d96b["FormDescription()"]
  df7b8a72_ee51_1783_1ce2_7ad74143d96b -->|calls| 94429819_53f2_f220_12d8_b0229985d8e4
  37558b2d_13c9_3946_625f_cc56ad2ec60d["FormMessage()"]
  37558b2d_13c9_3946_625f_cc56ad2ec60d -->|calls| 94429819_53f2_f220_12d8_b0229985d8e4
  style 94429819_53f2_f220_12d8_b0229985d8e4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/registry/new-york-v4/ui/form.tsx lines 45–66

const useFormField = () => {
  const fieldContext = React.useContext(FormFieldContext)
  const itemContext = React.useContext(FormItemContext)
  const { getFieldState } = useFormContext()
  const formState = useFormState({ name: fieldContext.name })
  const fieldState = getFieldState(fieldContext.name, formState)

  if (!fieldContext) {
    throw new Error("useFormField should be used within <FormField>")
  }

  const { id } = itemContext

  return {
    id,
    name: fieldContext.name,
    formItemId: `${id}-form-item`,
    formDescriptionId: `${id}-form-item-description`,
    formMessageId: `${id}-form-item-message`,
    ...fieldState,
  }
}

Subdomains

Frequently Asked Questions

What does useFormField() do?
useFormField() is a function in the ui codebase, defined in apps/v4/registry/new-york-v4/ui/form.tsx.
Where is useFormField() defined?
useFormField() is defined in apps/v4/registry/new-york-v4/ui/form.tsx at line 45.
What calls useFormField()?
useFormField() is called by 4 function(s): FormControl, FormDescription, FormLabel, FormMessage.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free