Loki React Editor - A Feature-Rich WYSIWYG Text Editor for React

Loki React Editor is a highly customizable, feature-rich WYSIWYG (What You See Is What You Get) text editor for React applications. With comprehensive support for text formatting, tables, hyperlinks, and more, it is ideal for developers who need to integrate a robust and flexible rich-text editor into their web applications.

🚀 Live Demo

Check out the live demo of Loki React Editor here.

📥 Installation

To install LOKI Editor in your project, run the following npm command:

npm install loki-editor

🛠️ Usage

Here’s an example of how you can use LOKI Editor in your React project:

1. Import the editor component and CSS file:

   import React from 'react';
   import TextEditor from 'loki-editor';
   import 'loki-editor/dist/TextEditor.css';

2. Use the editor in your React component:

   const App = () => {
     return (
       <div>
         <TextEditor />
       </div>
     );
   };
   
   export default App;

🔑 Features LOKI Editor comes with a variety of essential features to enrich your text editing experience:

📑 Text Formatting:

• Bold: Makes the selected text bold.
• Italic: Italicizes the selected text.
• Underline: Underlines the selected text.
• Strikethrough: Strikes through the selected text.

📝 Lists:

• Numbered List: Create a numbered list.
• Bulleted List: Create a bulleted list.

🖋️ Text Alignment:

• Align Left: Aligns the text to the left.
• Align Center: Aligns the text to the center.
• Align Right: Aligns the text to the right.

🔗 Links:

• Insert Link: Insert hyperlinks into your content.

📚 Bookmarks:

• Insert Bookmark: Insert bookmarks with names and links.

🎨 Additional Features:

• Highlight Text: Highlights the selected text in a chosen color.
• Change Text Color: Change the color of selected text.
• Text Indentation: Increase or decrease the indentation of text.
• Clear Formatting: Removes all formatting from the selected content.
• Font Style: Choose from multiple font styles.
• Font Size: Change the size of the selected text.
• Horizontal Rule: Insert a horizontal rule for separation.
• Line Break: Insert a line break.

🎨 Custom Styles You can easily customize the look and feel of the LOKI Editor by modifying the TextEditor.css file.

🧑‍💻 Development If you'd like to contribute to the development of Loki React Editor, feel free to clone the repository and submit pull requests. Please ensure your contributions adhere to the project's coding standards and provide detailed documentation for any changes.

📄 License This project is licensed under the MIT License.

❓ Support For any questions or assistance with Loki React Editor, feel free to reach out:

📧 Email: [logesh.b2213@gmail.com]