# <TextField /> Component

## Description

A component that shows a LIVE text input field or tools for configuring the text input field's look, feel, and behavior

## Checklist

This component should...

- (Rendering) Should render in the dom
- (Rendering) Should render an EDITOR or LIVE version of the component based on the value of the mode prop
- (Rendering) Should render a regular text input field when the mode is live
- (Rendering) Should render the AttributeContainer component when the mode is edit
- (Rendering) Should see that the <Label /> component has been rendered in the dom
- (Rendering) Should see that the <IconSelector /> component has been rendered in the dom
- (Rendering) Should see that the <Description /> component has been rendered in the dom
- (Rendering) Should see that the <Required /> component has been rendered in the dom
- (Rendering) Should only see that the <InitialValue /> component has been rendered if the "hide" value is false
- (Rendering) Should only see that the <Validation /> component has been rendered if the "hide" value is false
- (Events) Should trigger the onChange event (via handleChange()) if the AttributeContainer's onChange event is called
- (Actions) handleChange should convert the incoming payload to LiveFormFieldProps

## Usage

To install it...

> npm install @sandcastle/components

Add it to your project...

```
import * as React from 'react'
import * as TextField from '@sandcastle/components/TextField`

export default () => (
  <TextField

  />
)
```

## Best Practices

To do: Add any Best Practices here

## Lifecycle Hooks

To do: Add any Lifecycle Hooks here

## Related Components

To do: Add any Related Components here