@shamimsofte/universal-editor-core

A modern, fast, secure, framework-independent Rich Text Editor engine (built on ProseMirror & TipTap). Works seamlessly in Plain JavaScript, HTML, PHP, CodeIgniter, Laravel, WordPress, and all frontend frameworks.

🚀 Quick Start via CDN (TinyMCE Style)

No installation or build tools required. Just include the stylesheet and script in your HTML page:

<!-- Editor Stylesheet -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shamimsofte/universal-editor-core@latest/dist/styles.css">

<!-- Container -->
<div id="editor"></div>

<!-- Core Engine (UMD) -->
<script src="https://cdn.jsdelivr.net/npm/@shamimsofte/universal-editor-core@latest/dist/universal-editor.umd.js"></script>

<script>
  const editor = UniversalEditor.createEditor({
    element: document.getElementById('editor'),
    content: '<p>Hello world! Start typing or press "/" for commands...</p>',
    placeholder: 'Type something...',
    theme: 'light', // 'light' | 'dark' | 'sepia'
    enableToolbar: true,
    enableBubbleMenu: true,
    enableSlashCommands: true,
    onUpdate: ({ editor }) => {
      console.log('HTML content:', editor.getHTML());
    }
  });
</script>

📦 Installation via NPM

npm install @shamimsofte/universal-editor-core

Usage in Modern JavaScript (ES Modules):

import { createEditor } from '@shamimsofte/universal-editor-core';
import '@shamimsofte/universal-editor-core/styles.css';

const editor = createEditor({
  element: document.querySelector('#editor'),
  content: '<p>Welcome to Universal Editor</p>',
  enableToolbar: true,
  enableSlashCommands: true,
});

✨ Features

• ⚡ Framework Independent: Works in Vanilla JS, PHP, Vue 2, Vue 3, React, and Laravel.
• 🛡️ Enterprise Security: Built-in XSS sanitization preventing malicious scripts.
• 🎨 Modern Interface: Notion-style Slash Commands (/), Floating Bubble Menu, and customizable Toolbar.
• 🌗 Theme Engine: Built-in Light, Dark, and Sepia themes with full CSS custom property overrides.
• 📊 Rich Content Support: Tables with context menu, Code syntax highlighting (lowlight), YouTube/Vimeo embeds, images, task lists, and mentions (@).
• 🌍 Multilingual & RTL: Full Unicode support for complex scripts (Bengali, Arabic RTL, etc.).
• 💾 Autosave & History: Automatic draft recovery and snapshot version history.

📖 Full Documentation

Check out the complete User Integration Guide on GitHub for advanced configurations, backend API specifications, and Laravel integration.

📄 License

MIT © shamimSoftE