# &lt;FormInputProperyWindow /&gt; Component

## Description

The property window that shows for the form input field

## Checklist

This component should...

- (Rendering) Should render in the dom
- (Rendering) Should show the <EditFormField /> component in the Property Window as a section
- (Rendering) Should show position section
- (Rendering) Should show alignment section
- (Rendering) Should show field typography section
- (Rendering) Should show field size (width/height)
- (Rendering) Should show field border shadow
- (Rendering) Should show field position padding
- (Rendering) Should show validation style item section
- (Actions) Should trigger the handleFormFieldChange() method when the <EditFormField /> component showing in the property window changes
- (Actions) Should update the <LiveFormField /> component in the canvas when handleFormFieldChange is triggered
- (Actions) Should trigger the handleFieldSizeChange() method when the properties in the Field Size section changes
- (Actions) Should update the width and height of the form field when handleFieldSize method is triggered
- (Actions) Should trigger the handleFieldPositionPaddingChange() method when the properties in the position padding section changes
- (Actions) Should update the margin and padding of the form field when handleFieldPositionPaddingChange is triggered
- (Actions) Should trigger the handleBorderShadowChange() method when the properties in the position & padding section changes
- (Actions) Should update the border settings of the form field when handleBorderShadowChange is triggered
- (Actions) Should trigger the handleFontChange() method when the properties in the font/typography section changes
- (Actions) Should update the font size and family of the form field when handleFontChange is triggered

## Usage

To install it...

> npm install @sandcastle/components

Add it to your project...

```
import * as React from 'react'
import * as FormInputProperyWindow from '@sandcastle/components/FormFieldProperyWindow`

export default () => (
  <FormInputProperyWindow

  />
)
```

## 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
