# Field

Headless form field component that provides reactive properties and state. The field component takes a form store, path to field, and a render function that receives a field store to display field state and handle user interactions.

```tsx
<Field of={…} path={…} render$={…} />
```

## Generics

- `TSchema` <Property {...properties.TSchema} />
- `TFieldPath` <Property {...properties.TFieldPath} />

## Properties

- `of` <Property {...properties.of} />
- `path` <Property {...properties.path} />
- `render$` <Property {...properties.render$} />

### Explanation

The `Field` component is a headless component that doesn't render any UI itself. Instead, it provides a render prop function via the `render$` prop that receives a <Link href="../FieldStore/">`FieldStore`</Link> containing all the reactive state and props needed to render a form field.

The component automatically handles field registration, validation, and state management through the `of` prop that references the form store.

## Related

### Hooks

<ApiList
  items={[
    { text: 'useForm$', href: '../useForm$/' },
    { text: 'useField', href: '../useField/' },
  ]}
/>

### Components

<ApiList
  items={[
    { text: 'Form', href: '../Form/' },
    { text: 'FieldArray', href: '../FieldArray/' },
  ]}
/>