PHPackages opscale-co/nova-bpmn-field - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. opscale-co/nova-bpmn-field ActiveLibrary[Utility & Helpers](/categories/utility) opscale-co/nova-bpmn-field ========================== Interactive BPMN diagram viewer for Laravel Nova, powered by bpmn-js. 1.0.1(3w ago)0161MITShellPHP ^8.3CI passing Since Apr 29Pushed 3w agoCompare [ Source](https://github.com/opscale-co/nova-bpmn-field)[ Packagist](https://packagist.org/packages/opscale-co/nova-bpmn-field)[ RSS](/packages/opscale-co-nova-bpmn-field/feed)WikiDiscussions main Synced 1w ago READMEChangelog (2)Dependencies (12)Versions (3)Used By (1) Support us ---------- [](#support-us) At Opscale, we’re passionate about contributing to the open-source community by providing solutions that help businesses scale efficiently. If you’ve found our tools helpful, here are a few ways you can show your support: ⭐ **Star this repository** to help others discover our work and be part of our growing community. Every star makes a difference! 💬 **Share your experience** by leaving a review on [Trustpilot](https://www.trustpilot.com/review/opscale.co) or sharing your thoughts on social media. Your feedback helps us improve and grow! 📧 **Send us feedback** on what we can improve at . We value your input to make our tools even better for everyone. 🙏 **Get involved** by actively contributing to our open-source repositories. Your participation benefits the entire community and helps push the boundaries of what’s possible. 💼 **Hire us** if you need custom dashboards, admin panels, internal tools or MVPs tailored to your business. With our expertise, we can help you systematize operations or enhance your existing product. Contact us at to discuss your project needs. Thanks for helping Opscale continue to scale! 🚀 Description ----------- [](#description) BPMN diagrams usually live in designer tools (bpmn.io, Camunda Modeler, Signavio) and rarely make it into the apps that execute them. This package closes that gap: upload a `.bpmn` file from any Nova resource and the interactive process diagram shows up right on the record, with pan, zoom, and minimap — powered by `bpmn-js`. Compatible with Nova 5. [![Demo](https://raw.githubusercontent.com/opscale-co/nova-bpmn-field/refs/heads/main/screenshots/nova-bpmn-field.png)](https://raw.githubusercontent.com/opscale-co/nova-bpmn-field/refs/heads/main/screenshots/nova-bpmn-field.png) Installation ------------ [](#installation) [![Latest Version on Packagist](https://camo.githubusercontent.com/6f0d0b33da076388275ac896c15e0043c5cf79611328baf15f5b650eb3a3b529/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6f707363616c652d636f2f6e6f76612d62706d6e2d6669656c642e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/opscale-co/nova-bpmn-field) You can install the package in to a Laravel app that uses [Nova](https://nova.laravel.com) via composer: ``` composer require opscale-co/nova-bpmn-field ``` The package will auto-register its service provider. Back your field with a `string` column on the owning model — it stores the disk path of the uploaded `.bpmn`. The file itself lives on the Laravel disk of your choice (typically `public`). ``` Schema::create('diagrams', function (Blueprint $table) { $table->id(); $table->string('name'); $table->string('bpmn_path')->nullable(); $table->timestamps(); }); ``` Make sure the disk is publicly readable (for the default `public` disk: `php artisan storage:link`). Usage ----- [](#usage) Add the `BPMN` field to any Nova Resource that owns a BPMN attribute: ``` use Laravel\Nova\Fields\ID; use Laravel\Nova\Fields\Text; use Laravel\Nova\Http\Requests\NovaRequest; use Laravel\Nova\Resource; use Opscale\Fields\BPMN; class Diagram extends Resource { public static $model = \App\Models\Diagram::class; public function fields(NovaRequest $request): array { return [ ID::make()->sortable(), Text::make('Name')->rules('required', 'max:255'), BPMN::make('Diagram', 'bpmn_path', 'public') ->prunable() ->deletable() ->height(600) ->minimap() ->zoomControls(), ]; } } ``` On **Create / Update** the field renders Nova’s native File dropzone — pick a `.bpmn` or `.xml` file, it is uploaded to the configured disk and the path is persisted. On **Detail / Lens** the field fetches the file from the disk and renders the full interactive viewer. It is intentionally **hidden from Index**. ### Field behavior [](#field-behavior) ViewBehaviorCreate / UpdateNova’s native File field dropzone (`.bpmn`, `.xml`). Inherited storage, deletion, and `->prunable()` semantics.Detail / LensInteractive `bpmn-js` `NavigatedViewer` with pan, zoom, fit-to-viewport, and optional minimap.IndexHidden — a full process diagram inside a table cell adds no decision-making value.### Modifiers [](#modifiers) MethodPurpose`->height(int $pixels)`Canvas height in pixels (default `600`).`->minimap(bool $enabled = true)`Enable the minimap overlay.`->zoomControls(bool $enabled = true)`Show the in-canvas zoom in / out / reset buttons.`->prunable()` / `->deletable()`Inherited from `Laravel\Nova\Fields\File` — remove the stored file when the record is deleted or the field is cleared.### Under the hood [](#under-the-hood) LayerDependencyUpload / storage`Laravel\Nova\Fields\File` — disk-backed upload, deletion, prunable.Renderer[`bpmn-js`](https://bpmn.io/toolkit/bpmn-js/) `NavigatedViewer`.The PHP field class is a thin subclass of Nova’s `File`; the Vue `form` and `index` slots alias `form-file-field` and `index-file-field` verbatim, so there is no custom upload UI to maintain. Only the `detail` slot is custom — it reads `field.previewUrl`, fetches the XML, and mounts the viewer. Testing ------- [](#testing) ``` npm run test ``` Changelog --------- [](#changelog) Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently. Contributing ------------ [](#contributing) Please see [CONTRIBUTING](https://github.com/opscale-co/.github/blob/main/CONTRIBUTING.md) for details. Security -------- [](#security) If you discover any security related issues, please email instead of using the issue tracker. Credits ------- [](#credits) - [Opscale](https://github.com/opscale-co) License ------- [](#license) The MIT License (MIT). Please see [License File](LICENSE.md) for more information. ### Health Score 42 — FairBetter than 88% of packages Maintenance95 Actively maintained with recent releases Popularity8 Limited adoption so far Community10 Small or concentrated contributor base Maturity49 Maturing project, gaining track record Bus Factor1 Top contributor holds 71.4% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~19 days Total 2 Last Release 22d ago ### Community Maintainers ![](https://avatars.githubusercontent.com/u/3722594?v=4)[opscale](/maintainers/opscale)[@opscale](https://github.com/opscale) --- Top Contributors [![opscale-development](https://avatars.githubusercontent.com/u/181295122?v=4)](https://github.com/opscale-development "opscale-development (5 commits)")[![semantic-release-bot](https://avatars.githubusercontent.com/u/32174276?v=4)](https://github.com/semantic-release-bot "semantic-release-bot (2 commits)") --- Tags laravelfieldnovavisualizerbpmnbpmn-js ### Code Quality TestsPest Static AnalysisPHPStan, Rector Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/opscale-co-nova-bpmn-field/health.svg) ``` [![Health](https://phpackages.com/badges/opscale-co-nova-bpmn-field/health.svg)](https://phpackages.com/packages/opscale-co-nova-bpmn-field) ``` ### Alternatives [markwalet/nova-modal-response A Laravel Nova asset for Modal responses on an action. 17818.7k](/packages/markwalet-nova-modal-response)[alexwenzel/nova-dependency-container A Laravel Nova 4 form container for grouping fields that depend on other field values. 461.1M2](/packages/alexwenzel-nova-dependency-container)[simplesquid/nova-enum-field A Laravel Nova field to add enums to resources. 52410.1k2](/packages/simplesquid-nova-enum-field)[sietse85/nova-button (Nova 4+) A Laravel Nova package for adding buttons to your resources. 37362.4k](/packages/sietse85-nova-button)[optimistdigital/nova-notes-field This Laravel Nova package adds a notes field to Nova's arsenal of fields. 52142.9k](/packages/optimistdigital-nova-notes-field)[outl1ne/nova-color-field A Laravel Nova Color Picker field. 26259.6k](/packages/outl1ne-nova-color-field) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)