Filament Quill Laravel Package

Getting Started

Install the package via Composer and let Filament pick up its assets:

composer require rawilk/filament-quill
php artisan filament:assets   # if you publish/serve assets explicitly

There is usually no mandatory config publish; if you need to tweak defaults, publish the package config/views and inspect the options there first:

php artisan vendor:publish --tag="filament-quill-config"

The fastest first use case is replacing a RichEditor on a content field:

use Rawilk\FilamentQuill\Forms\Components\QuillEditor;

QuillEditor::make('content')
    ->toolbarButtons(['bold', 'italic', 'link', 'bulletList', 'orderedList', 'blockquote'])
    ->minHeight('12rem');

Look first at the field class itself (methods for toolbar buttons, min height, and Quill options) and at the published config for anything you'd otherwise set globally. For day-to-day work, treat QuillEditor as a drop-in form component: add it to a Form, persist the HTML string like any other text column, and render it back through your normal (sanitized) output path.

Implementation Patterns

Form fields. Use QuillEditor::make('column') inside form() schemas like any other Filament field. Chain toolbar/min-height configuration per field rather than globally when different resources need different editing surfaces:

QuillEditor::make('body')
    ->toolbarButtons(['bold', 'italic', 'link'])
    ->minHeight('8rem')
    ->columnSpanFull();

Global defaults. For consistent toolbars across a panel, set defaults once in the published config and only override on the exceptional fields. This keeps resource classes short and reduces drift between forms.

Persisting and rendering. The field stores HTML. Keep a single sanitization path on the server (e.g. an HTML purifier or a trusted-markdown-to-HTML pipeline) applied on save and/or on render, and never echo raw editor output with {!! !!} unless it has been sanitized. A common pattern is ->dehydrateStateUsing(fn ($state) => $this->sanitize($state)) on the field, or sanitizing in the model/observer.

Tables and previews. Since content is HTML, use TextColumn::make('body')->html()->limit(...) or strip tags for list views; don't let full Quill markup leak into table cells.

Custom Quill behaviour. For anything beyond toolbar buttons, pass additional Quill options through the field/config (or a small custom Alpine/JS hook) rather than forking the package. Keep custom modules registered in a panel asset so they load wherever the field is used.

Testing. Feature tests can set the field the same way as other Filament fields (fillForm(['content' => '<p>Hello</p>'])); assert on stored HTML rather than on editor DOM. If you assert sanitized output, test both the save and render paths.

Gotchas and Tips

• v2.0.1 quirk — soft line breaks. Shift+Enter now produces a proper soft break in Quill. If you previously relied on the old behaviour, re-check content authored before the upgrade: existing records may contain <br> versus <p> patterns, and your sanitizer/CSS must handle both. This is a patch-level behaviour change, so verify rendering after upgrading.
• v2.0.1 quirk — min-height CSS. The editor minimum height moved off Tailwind @apply to direct CSS. If you were overriding the editor height via @apply in a custom theme or panel stylesheet, switch to plain CSS or the field's minHeight() option; the direct-CSS approach is more reliable when Tailwind isn't compiled in the panel, but any custom @apply-based override will no longer match.
• Asset caching after upgrade. After bumping the package, clear caches (php artisan optimize:clear, and re-run filament:assets if you publish them) or you can end up serving the old editor JS/CSS and see stale behaviour.
• Sanitization is your job. Quill emits inline styles and arbitrary HTML structures; the package doesn't guarantee safe output. Validate on save and sanitize on render.
• Filament compatibility. Check the composer.json constraint for the Filament major you run before upgrading; keep the editor package version aligned with the panel version rather than mixing majors.
• Live validation timing. Quill syncs its HTML back to Livewire on change/blur; if you use live() validation, expect validation to fire on blur rather than per keystroke. Add debounce or rely on submit-time validation if that's disruptive.
• CSP and dark mode. Strict Content-Security-Policy headers can block Quill's inline styles; test in the panels where CSP is enforced. Dark mode generally follows Filament's theme, but custom toolbar colours should be set with CSS variables, not hard-coded values.
• Extension points. Prefer the published config and field methods (toolbar, min height, Quill options) for customization; a custom panel asset is the right place for extra Quill modules, and it keeps you upgrade-safe compared with editing vendor views.