> For the complete documentation index, see [llms.txt](https://redd.gitbook.io/react-advanced-form/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://redd.gitbook.io/react-advanced-form/hoc/create-field/exposed-props.md).

# Exposed props

Wrapping a React component in `createField` high-order component automatically exposes the properties listed below. These properties can be used for field styling and custom logic or behavior.

## Props list

| Prop name    | Type     | Description                                                                                       |
| ------------ | -------- | ------------------------------------------------------------------------------------------------- |
| `fieldProps` | `Object` | Object of essential props for the primitive field components (i.e. input, select, textarea, etc). |
| `fieldState` | `Object` | Object representing a field's state.                                                              |

> `fieldProps` are composed from the `fieldState` and are exposed separately to ease the process of props assignment to the form elements.

## `fieldState`

Object representing a field's state.

### General

| Prop name  | Type      | Description                                                                                                                                                                |
| ---------- | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `touched`  | `boolean` | Indicates whether the field has been interacted with.                                                                                                                      |
| `required` | `boolean` | Indicates whether the field is required.                                                                                                                                   |
| `disabled` | `boolean` | Indicates whether the field is disabled.                                                                                                                                   |
| `skip`     | `boolean` | Indicates whether the field should be skipped during any serialization process. Read more about [`Field.props.skip`](/react-advanced-form/components/field/props/skip.md). |

### Validity state

| Prop name | Type      | Description                                                     |
| --------- | --------- | --------------------------------------------------------------- |
| `valid`   | `boolean` | Indicates whether the field has passed all the validations.     |
| `invalid` | `boolean` | Indicates whether the field has not passed all the validations. |

### Validation

| Prop name        | Type       | Description                                                                                |
| ---------------- | ---------- | ------------------------------------------------------------------------------------------ |
| `validating`     | `boolean`  | Indicates whether the field is being validated at the moment.                              |
| `errors`         | `string[]` | Collection of the validation errors relative to the fields at the given point of time.     |
| `validated`      | `boolean`  | Indicates that the field has been validated, regardless of the validation type and status. |
| `validatedSync`  | `boolean`  | Indicates whether the field has been validated synchronously.                              |
| `validSync`      | `boolean`  | Indicates whether the field is valid relatively to its synchronous validation rules.       |
| `validatedAsync` | `boolean`  | Indicates whether the field has been validated asynchronously.                             |
| `validAsync`     | `boolean`  | Indicates whether the field is valid relatively to its asynchronous validation rules.      |

## Example

Exposed props can be accessed in `this.props` of your component.

```jsx
import React from 'react'
import { createField } from 'react-advanced-form'

class CustomField extends React.Component {
  render() {
    const { fieldProps, fieldState } = this.props
    const { valid, invalid, errors } = fieldState

    return (<input {...fieldProps} />)
  }
}

export default createField()(CustomField)
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://redd.gitbook.io/react-advanced-form/hoc/create-field/exposed-props.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.