1.0.1 • Published 7 years ago

react-editable-html-element v1.0.1

Weekly downloads
2
License
ISC
Repository
github
Last release
7 years ago

react-editable-html-element

Allows HTML elements to be modified in place by changing them into inputs when clicked.

Examples

Install

npm install --save react-editable-html-elements

Usage

import React from 'react';
import EditableElement from 'react-editable-html-element';

const YourComponent = () => {
  const yourProps = {
    // See Props section
  };

  return <EditableElement {...yourProps} />;
}

Props

NameTypeDescriptionDefault
allowEditingboolSet to false to disable editing completely.true
editableboolShould the element be editable when mounted?false; true if the value prop is empty
elementstring (see src/htmlTags.js for the allowed HTML elements)The HTML element.'div'
elementClassNamestringCSS class(es) to apply to the element.''
elementStyleobjectReact-formatted CSS to apply to the element.{}
inputClassNamestringCSS classes(es) to apply to the input.''
inputStyleobjectReact-formatted CSS to apply to the input.{}
onChangefunctionOverride the component's built-in input change.null
onKeyDownfunctionOverride the component's built-in onKeyDown function.null
placeholderstringText to display when the input is empty.'Enter text'
valuestringThe value of the element/input.''