- What is trecenode/filament-mermaid-field used for?
- It is a Filament form field that adds a Mermaid.js-powered code editor with a live diagram preview to your Laravel admin panel. Users can author and visualize flowcharts, sequence diagrams, Gantt charts, and other Mermaid diagram types directly inside a Filament form. The diagram source is plain text, so it is stored like any other string or text column in your model.
- How do I install and register filament-mermaid-field in a Laravel Filament panel?
- Install it with Composer using composer require trecenode/filament-mermaid-field, then publish the package config and assets with the vendor:publish command documented in the README. Finally, register the plugin on your Filament panel provider so the field and its front-end assets are available to your resources. No separate service, queue, or storage engine is required.
- Which Filament versions does filament-mermaid-field support, and does 3.0 drop Filament 4?
- Version 3.0 targets Filament 5, while the 2.x line is aligned with Filament 4. Because the 3.0 release note is only described as a compatibility bump, you should read the exact filament/filament constraint in the package's composer.json rather than assume. If your panels are still on Filament 4, expect to stay pinned to 2.x and plan the package upgrade as part of your Filament 5 migration.
- What PHP and Laravel versions does filament-mermaid-field require?
- The package declares its platform floor through its composer.json require block, and that constraint can shift between major versions. Check the require entries for php and laravel/framework before adopting a new major, since a Filament 5 bump may also raise your minimum Laravel minor. If your fleet is not yet on that Laravel version, the package upgrade is gated behind a framework upgrade.
- Do I need Node.js or a front-end build step to render Mermaid diagrams in Filament?
- No. The package is designed to work with minimal setup and no extra build tooling, so you do not need Vite or a Node pipeline to compose diagrams. Assets are served from the package once published, and the Mermaid rendering happens in the browser. If you enforce a Content Security Policy, confirm the published scripts and styles are allowed.
- How do I add the Mermaid diagram editor to a Filament resource form?
- Use the package's field class inside your resource's form schema the same way you would use any other Filament field. The field renders the editor on the left and a live preview of the compiled diagram, so users get immediate feedback while typing. Bind it to a text or longText column on your model to persist the diagram definition.
- Is upgrading filament-mermaid-field from 2.x to 3.0 a breaking change?
- Treat it as breaking until you have verified otherwise, because the 3.0 release is documented only as a Filament 5 compatibility bump with no detailed changelog. Branch, bump to ^3.0, and let Composer surface the Filament constraint conflict before changing anything else. Then republish config and assets to a scratch directory and diff them against your current published set to catch renamed keys or removed options, and run a full panel smoke test.
- How should I store and validate the Mermaid diagram source in the database?
- The editor produces plain Mermaid markup, so persist it in a normal text or longText column and keep it portable across environments. Apply standard Filament validation rules such as required and maxLength, and consider validating on save if malformed diagrams should be rejected. Because the value is text, it diffs cleanly in version control and exports easily.
- How do I test a Filament form that uses the Mermaid field?
- Test it through Filament's Livewire testing helpers by filling the field and asserting the form state and the saved model attribute, rather than trying to assert on the rendered SVG. Diagram rendering happens client-side, so browser-level preview assertions belong in a Dusk or Playwright suite, if you test them at all. Make sure published assets exist in the test environment so the component mounts without errors.
- Is trecenode/filament-mermaid-field actively maintained and safe to depend on?
- Maintenance appears tied to Filament's own release cadence, and the 3.0 major shipped with a one-line note, which is a documentation disclosure signal rather than proof of instability. Before adopting, review the repository's recent commit history, open issue volume, and whether CI covers tests, and treat the package's version constraint as a compatibility pin. If that risk is unacceptable, a plain Filament code editor field plus a custom Blade preview is a viable in-house alternative.