# EditableField

![size](https://img.shields.io/bundlephobia/min/@propellerads/editable-field.svg)
![](https://img.shields.io/npm/v/@propellerads/editable-field.svg?style=flat-square)

[NPM](https://www.npmjs.com/package/@propellerads/editable-field) |
[Github](https://github.com/propellerads/ui-components/tree/master/Components/editable-field)

## Installation
* `yarn add @propellerads/editable-field` or `npm install @propellerads/editable-field -S`

### How to use
* `import EditableField from '@propellerads/editable-field';`
* And render
```
<EditableField
    isEditable
    isLoading={false}
    value="value"
    onFocus={() => console.log('onFocus')}
    onSave={() => console.log('onSave')}
    onCancel={() => console.log('onCancel')}
    onChange={(value) => console.log('onChange', value)}
    elementId="stories-default-view"
/>
```