<EditableLabel> is a small React component which provides inline editing by click on it's text label.

Installation

npm install --save editable-text-label
# or
yarn add editable-text-label

Example

import React from 'react'
import { EditableLabel } from 'editable-text-label'

export const example = () => {
    const value = 'Default value'
    const onChange = v =>
        console.log('Entered text: ', v)

    return <EditableLabel value={value}
        onChange={onChange}
        inputSize={5} />
}

You can run a demo locally by clonning the project and running yarn install && yarn start command.