# 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.


![LOKI Editor](https://github.com/Logesh2213/loki-editor/blob/main/text_editor.png
)

## 🚀 Live Demo

Check out the live demo of **Loki React Editor** <a href="https://codesandbox.io/p/devbox/naughty-leavitt-klj54l" target="_blank">here</a>.

## 💖 Support the Project

If you enjoy using **Loki React Editor** and would like to support its development, consider contributing through <a href="https://buymeacoffee.com/logeshb" target="_blank">Buy Me A Coffee</a>.

## 🐞 Report Bugs

If you encounter any issues or bugs while using **Loki React Editor**, please report them on our <a href="https://github.com/Logesh2213/loki-editor/issues" target="_blank">GitHub Issues page</a>.

---

## 📦 Installation
Install **Loki Editor** via npm:
```sh
npm install loki-editor
```

## 🛠️ Usage

1. Import Loki Editor into your React project:

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

2. Use the editor in your component:

    ```javascript
    const App = () => {
      return (
        <div>
          <TextEditor />
        </div>
      );
    };

    export default App;
    ```


## ✨ Key Features
## 📝 Text Formatting
- ✅ Bold / Italic / Underline / Strikethrough
- ✅ Highlighting & Custom Colors
- ✅ Font Styles & Sizes

## 📑 Lists & Structure
- 🔢 Numbered & Bulleted Lists
- ↔️ Text Alignment (Left, Center, Right)
- ⎯ Insert Horizontal Rules

## 🔗 Hyperlinks & Navigation
- 🔗 Insert & Edit Links
- 📍 Bookmarks for Quick Navigation

## 🎨 Customization & Styles
- 🖌️ Customizable Toolbar & Themes
- 📝 Supports Custom Plugins

## 🔥 Additional Features
- ⚡ Lightweight & Fast
- 🧩 Easy Integration with Any React App
- 🔄 Undo & Redo Support

## 🖥️ Browser Compatibility
- ✅ Google Chrome (latest)
- ✅ Mozilla Firefox (latest)
- ✅ Safari (latest)
- ✅ Microsoft Edge (latest)

## 💡 Why Choose Loki Editor?
- 🎨 Modern & Customizable - Adapt the toolbar, styles, and themes to your needs.
- ⚡ Fast & Lightweight - Optimized for performance in React applications.
- 📌 SEO & Accessibility Focused - Works seamlessly with assistive technologies.

🔗 MIT Licensed & Open Source - Free for both personal and commercial use.

## 📩 Contact & Support
For any questions, feedback, or business inquiries, reach out to me at:
📧 Email: logesh.b2213@gmail.com