Filament Tinyeditor 6 Laravel Package

Getting Started

TinyEditor is a Filament form field that swaps Filament's stock rich editor for a self-hosted TinyMCE instance.

1. Install the package:

   composer require rectitude-open/filament-tinyeditor-6
   

2. Publish the config and (since v6.4.0) the local TinyMCE assets:

   php artisan vendor:publish --tag="filament-tinyeditor-config"
   php artisan vendor:publish --tag="filament-tinyeditor-assets"   # if provided by your install
   php artisan filament:assets
   

3. Use it in any form schema like a normal field:

   use RectitudeOpen\FilamentTinyEditor\TinyEditor;
   
   TinyEditor::make('body')
       ->label('Content')
       ->profile('default')
       ->columnSpanFull();
   

Where to look first: config/filament-tinyeditor.php — it defines profiles (toolbar, plugins, menubar, height, upload settings). The "default" profile is a good starting template; copy it to add your own.

First practical use case: a CMS-style body field on a Post resource, using the default profile plus file_picker/upload wiring so authors can embed images and paste formatted copy from Word (see below).

Implementation Patterns

Multiple profiles per app. Define simple, default, and full profiles in the config, then select per field with ->profile('full'). This keeps a lightweight editor on short fields (excerpts, captions) and a full toolbar only where it matters (long-form pages), avoiding a single bloated global config.

Paste-from-Word workflows (new in v6.4.0). For editorial teams pasting from Microsoft Word, enable the new paste-from-word-plugin in the plugins list of the relevant profile, and keep the core paste plugin enabled. This produces cleaner HTML than the default browser paste path (no stray mso-* styles). Pair it with a profile that also enables code so editors can sanity-check output.

Self-hosted assets (v6.4.0 change). TinyMCE is no longer pulled from a CDN; assets ship with the package. This is what you want for air-gapped, intranet, or strict-CSP deployments — no external script-src exceptions for cdn.tiny.cloud. In Docker/CI builds, ensure the publish/filament:assets step runs as part of deploy, otherwise the editor renders an empty textarea.

Upload / file picker integration. TinyMCE's uploader expects an endpoint returning { "location": "..." }. The cleanest pattern is a dedicated Filament route/controller (or a Livewire component) that stores via Laravel's Storage facade and returns the JSON shape TinyMCE expects, then point the profile's images_upload_url at it. Keep disk and visibility (public vs. private) explicit in the config rather than hardcoding in the controller.

Content sanitization on save. Treat editor output as untrusted at the boundary: run it through an HTML sanitizer (e.g. mews/purifier) in a form mutateFormDataBeforeSave() hook or an observer, allowlisting the tags your profile's toolbar can actually produce. This matters most when code/source is enabled.

Reusable field factory. Wrap the field in a small helper (e.g. ContentEditor::make('body')) that applies your default profile, columnSpanFull(), and helper text consistently, so profile/asset changes land in one place.

Gotchas and Tips

• Upgrading to v6.4.0 requires republishing assets. Because TinyMCE is now bundled locally instead of loaded from a dependency/CDN, existing installs must re-run php artisan filament:assets (and clear view:clear/config:clear). A "blank editor / 404 on /js/tinymce/..." after upgrade almost always means stale published assets.
• Asset version cache. Filament caches asset manifests; if the editor looks stale, php artisan filament:assets then hard-refresh. In production deploys, put this in the release script rather than relying on manual runs.
• No CDN means no free TinyMCE cloud services. Cloud-only plugins/features (premium or remote-hosted) are not available out of the box; if you relied on them, you'll need to self-host those plugin files in the same asset directory and register them in the profile's plugins list.
• Profile keys are strict. Typos in ->profile('adnvanced') silently fall back or error depending on version — verify the key exists in config/filament-tinyeditor.php and that config is cached correctly (config:cache in prod).
• Plugin enablement is two-part. Listing a plugin in plugins only works if the corresponding plugin script is loaded. For the new paste-from-word, confirm the plugin file is present in the published assets and that you also keep paste enabled — otherwise Word pastes may bypass the cleaning logic.
• The -6 suffix tracks the TinyMCE major version. Don't mix usage/docs with the -7 line; API and config shape differences will bite. Pin the major in composer.json and review changelogs on major bumps.
• CSP and inline styles. TinyMCE injects inline styles/skins; if you run a strict Content-Security-Policy, you'll need style-src 'unsafe-inline' (or nonces) scoped to the editor route. The self-hosting change helps with script-src but not style-src.
• Debugging paste output. Use the code plugin (or disable valid_elements) temporarily to inspect what Word actually pasted, then tighten the sanitizer. Keep the sanitizer allowlist in sync with the toolbar — editors can't create what's stripped, so align them.
• Extension points. Config profile arrays are the supported customization surface; for deeper changes prefer a custom Filament view/asset override over editing vendor files, since the v6.4.0 asset-location change is exactly the kind of refactor that breaks vendor patches.