@mindfiredigital/textigniter-react NPM

The @mindfiredigital/textigniter-react is a tool that allows developers to integrate TextIgniter.

Live Demo

Features

Bold: When you apply bold formatting to text, it makes the selected text appear thicker and more prominent.
Italic: Italic text is slanted to the right.
Underline: Underlining text places a horizontal line beneath it.
Subscript: Subscript lowers the selected text below the baseline.
Superscript: Superscript raises the selected text above the baseline.
Left Align: This feature aligns text to the left margin, creating a straight left edge.
Center Align: Center alignment places text in the middle of the page or text box.
Right Align: Text is aligned to the right margin, creating a straight right edge..
Bullet List: Bullet lists present information as a series of items with bullets.
Numbered List: Numbered lists provide a sequential order to items.
Insert Table: This feature allows you to create tables to organize data.
Insert Layout: This feature allows you to create Layout to organize data.
Heading: Headings are typically used to divide a document into sections or chapters. They are usually styled differently, such as with larger text or bold formatting.
Hyperlink: A hyperlink is a clickable link that connects to a webpage or another location within the document.
Image: This feature allows you to insert images or graphics into your document to enhance its visual appeal or convey additional information.
GETHTML: This feature allows you to get HTML for the data of editor.
GETJSON: This feature allows you to get JSON for the data of editor.
Custom Height: This feature allows you to set height of editor.

Installation

To install the @mindfiredigital/textigniter-react npm package in your project, use the following command:

npm install @mindfiredigital/textigniter-react

Getting Started

Initialization: Initialize the TextIgniter in your project.

import { FC } from 'react';
// @ts-ignore
import { Textigniter} from '@mindfiredigital/textigniter-react';

const App: FC = () => {
  return (
    <>
      <Textigniter
        config={{
          showToolbar: true,
          features: [
            "bold",
            "italic",
            "underline",
            "hyperlink",
            "fontFamily",
            "fontSize",
            "alignLeft",
            "alignCenter",
            "alignRight",
            "unorderedList",
            "orderedList",
            "image",
            "fontColor",
            "bgColor",
            "getHtmlContent",
            "loadHtmlContent"
          ]
        }}
      />
    </>
  );
};

export default App;

Contributing

We welcome contributions from the community. If you'd like to contribute to the textigniter-react npm package, please follow our Contributing Guidelines.

License

Licensed under the MIT license.

@mindfiredigital/textigniter-react v1.1.0