webmobyle/laravel-trix

A reusable Laravel Trix editor package with min/max validation, counters, error focus, sanitization, and toolbar presets.

1.0.2 2025-12-25 18:48 UTC

Requires

• php: ^8.2
• illuminate/support: ^10.0|^11.0|^12.0

MIT

README

A reusable Laravel Trix editor package with min/max validation, counters, error focus, sanitization, and toolbar presets.

This package provides a Blade-based Trix editor with:

• multiple editors per page
• client-side + server-side validation
• min/max character limits
• live character counters
• automatic scroll & focus on validation errors
• safe, configurable HTML sanitization
• configurable toolbar presets
• clean Blade directives for easy setup

Built for long-lived Laravel projects and internal SaaS platforms.

🚀 Features

Editor

• Multiple Trix editors per page
• Required, minimum, and maximum character validation
• Live character counter
• Client-side validation with inline errors
• Scrolls and focuses the first invalid editor on submit
• Falls back gracefully to Laravel server-side validation

Server-Side

• TrixTextLength validation rule (min/max, text-based)
• Blank-content normalization (<div><br></div> → empty string)
• Optional sanitization middleware
• Consistent behaviour across projects

Sanitization

• Built-in allowlist sanitizer (no dependencies)
• Optional HTMLPurifier driver
• Secure external link handling
• Middleware and trait-based usage

Toolbars

• Config-driven toolbar presets
• Per-editor toolbar selection
• No duplicated JS configuration

Blade Directives

• @trixAssets – loads everything
• @trixToolbars – injects toolbar presets only

📦 Installation

composer require webmobyle/laravel-trix

Publish config and assets:

php artisan vendor:publish --tag=trix-config
php artisan vendor:publish --tag=trix-vendor --force
php artisan vendor:publish --tag=trix-assets --force

🏃 Quick Start

In your main layout:

@trixAssets

In your Blade view:

<x-trix-editor
    name="bio"
    label="Bio"
    :required="true"
    :min-chars="50"
    :max-chars="500"
    toolbar="simple"
/>

✅ Validation

Form Request

use Webmobyle\LaravelTrix\Rules\TrixTextLength;

public function rules(): array
{
    return [
        'bio' => ['required', new TrixTextLength(min: 50, max: 500)],
    ];
}

Behaviour

• Counts visible text, not HTML
• Normalizes empty Trix content
• Fully aligned with client-side logic

☑️ Sanitization

Middleware (recommended)

Route::post('/profile', [ProfileController::class, 'update'])
    ->middleware('trix.sanitize:bio,notes');

Trait Usage

use Webmobyle\LaravelTrix\Concerns\SanitizesTrixHtml;

$data = $this->sanitizeTrixFields($data, ['bio']);

Drivers

• basic (default, no dependencies)
• purifier (requires ezyang/htmlpurifier)

Configured in config/trix.php.

📄 Displaying Saved Content

<x-trix-display :value="$post->body" />

Automatically sanitizes output unless disabled.

⚙️ Toolbar Presets

Configured in config/trix.php:

'toolbar' => [
    'default' => 'simple',
    'presets' => [
        'simple' => [
            'history' => true,
            'text' => ['bold', 'italic', 'link'],
            'block' => [],
            'list' => ['bullet'],
        ],
    ],
],

Per-editor usage:

<x-trix-editor name="notes" toolbar="full" />

🧱 Requirements

Dependency	Version
PHP	^8.2
Laravel	10.x – 12.x

🪪 License

This package is open-sourced software licensed under the MIT License.

👤 Author

Barnett Temwa Msiska
Founder, Webmobyle Limited
📧 [e-mail]

⭐ Support

If you find this package useful, please star it on Packagist or Bitbucket.
Contributions, pull requests, and issues are welcome!

Email: [e-mail]