Laravel Rich Text Editor

A modern, secure rich text editor for Laravel forms, Alpine.js, Tailwind CSS, and Livewire. It stores semantic HTML, ships with its browser assets, and provides both a lightweight code view and an enhanced Monokai code editor.

This README is the express guide. See the full documentation for every option, integration, and security detail.

Requirements

• PHP 8.1 or newer
• Laravel 10, 11, 12, or 13
• Livewire 3 or 4 when Livewire binding is needed
• A modern evergreen browser

Install

composer require arm092/laravel-rich-text-editor
php artisan rich-text-editor:publish

The publish command copies the configuration and prebuilt assets. Use --force after upgrades when you intentionally want to refresh published files.

Blade in one minute

<x-rich-text-editor
    name="content"
    :value="old('content', $post->content)"
    label="Content"
    profile="standard"
/>

The submitted content value is HTML. For safe persistence, add the package cast:

use Arm092\RichTextEditor\Casts\RichTextCast;

protected function casts(): array
{
    return [
        'content' => RichTextCast::class . ':standard',
    ];
}

Laravel 10 applications should place the same entry in the model's protected $casts property.

Render saved content through the defensive renderer:

<x-rich-text-content :content="$post->content" profile="standard" />

Livewire

<x-rich-text-editor wire:model="form.content" label="Content" />

The component synchronizes through a native textarea and isolates the editor-managed DOM with wire:ignore. Default, .live, .blur, and .change model modifiers pass through unchanged.

Standalone JavaScript

Basic code view:

<script src="/vendor/rich-text-editor/rich-text-editor.js" defer></script>
<div data-rich-text-editor></div>

Enhanced code view:

<script src="/vendor/rich-text-editor/rich-text-editor-with-code.js" defer></script>
<div id="editor"></div>
<script>
    document.addEventListener('DOMContentLoaded', () => {
        window.editor = RichTextEditor.create('#editor')
    })
</script>

Both files expose the same API: create, scan, destroy, getHTML, setHTML, focus, setReadOnly, and instance destroy.

Common configuration

Roadmap

• Visual-editor dark theme with light, dark, and auto modes
• Responsive image drag-resize
• Tables
• Additional interface translations
• npm publishing with ESM modules
• A documented extension registry

See the full roadmap for scope notes and exclusions.

Documentation

• Installation and updates
• Blade and Livewire
• Standalone JavaScript
• Configuration and profiles
• Code view
• Security, casting, and rendering
• JavaScript API and events
• Troubleshooting

License

Laravel Rich Text Editor is open-source software released under the MIT License.