1.0.6 • Published 1 year ago

rich-html-textarea v1.0.6

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

A simple react rich html textarea

This project is a simple example of a rich HTML text area with line numbers and a copy icon. The text area allows users to input and edit code, with line numbers to aid readability, and a copy button for easy sharing.

Please see the DEMO here

Install

npm

npm install --save rich-html-textarea

yarn

yarn add rich-html-textarea

Example

import RichTextarea from "rich-html-textarea";

const App = () => {
  const [text, setText] = useState("");

  const onChange = (input) => {
    setText(input);
  };

  return (
    <div>
      <RichTextarea value={text} onChange={onChange} />
    </div>
  );
};

export default App;

API

PropTypeRequiredDefaultDescription
valueStringText value of the textarea
onChangeFunctionThis function is used to capture the change in textarea. It can be used to update the state in your file.
showLineBooleantrueShow line numbers in the textarea
showCopyIconBooleantrueshow copy icon on the top right corner of textarea
cssCSSPropertiesControl width/height and other css properties
nameStringSpecifies a name for a text area
placeholderStringSpecifies a short hint that describes the expected value of a text area
disabledBooleanfalseSpecifies that a text area should be disabled
readOnlyBooleanfalseSpecifies that a text area should be read-only
maxLengthBooleanfalseSpecifies the maximum number of characters allowed in the text area
autoFocusBooleanfalseSpecifies that a text area should automatically get focus when the page loads
                                                                            |