Prefiller Field Laravel Package

Getting Started

What it is: a Laravel Nova form field that watches another field in the same form and copies (or derives) its value into itself — the classic "type a title, get a slug" pattern, plus address-copying, SKU generation, and similar form ergonomics. It is a pure Nova field: no migrations, no service provider config, no database footprint. Its entire value is client-side form behavior.

Minimal steps:

1. composer require marshmallow/prefiller-field
2. Open the package's src/ directory first — the README is thin, but the field class (typically Prefiller) and its *.vue component are the whole package. Skim both before wiring anything up; you'll understand the available options in two minutes.
3. Add the field to a Nova resource's fields() method, pointing it at a source field:

use Marshmallow\PrefillerField\Prefiller;

public function fields(NovaRequest $request)
{
    return [
        Text::make('Title'),
        Prefiller::make('Slug')
            ->from('title')
            ->onlyOnForms(),
    ];
}

(Method names are illustrative — confirm from()/trigger options against the class source, since the README does not document them exhaustively.)

4. First use case to validate the install: create form for a resource with a title/slug pair. Type into the title, tab out, confirm the slug populates. If that works, the field is loaded and the source-field matching is correct.

Reality check before you commit: 2 stars, 0 dependents, last release August 2023. This predates Nova 5 and sits right at the Nova 4 era. Treat it as a reference implementation you install to read, not a dependency you build a product on. If it works on your Nova version, great; if not, the Vue component is small enough to vendor into your app in an afternoon.

Implementation Patterns

Auto-slug with user override protection. The single most valuable pattern. Pair the prefiller with server-side generation so behavior is identical for API writes and imports:

// Form: prefill for UX
Prefiller::make('Slug')->from('title')->onlyOnForms(),

// Model: authoritative
protected static function booted()
{
    static::saving(function ($model) {
        if (blank($model->slug)) {
            $model->slug = Str::slug($model->title);
        }
    });
}

The field makes the form pleasant; the observer makes the data correct. Never let the field be the only thing producing the value.

Only fill empty targets. The most common complaint with any prefill field is clobbering a value the user already edited. Configure the field (or wrap it) so it only writes when the target is empty, and so a manual edit "detaches" it from the source.

Chained prefills. Use prefiller A to fill field B, then a second prefiller to derive C from B. Works well for company_name → legal_name → invoice_prefix style flows. Avoid long chains — each hop is a client-side reactive edge and each one is a failure point when the user types fast.

Copy blocks (billing → shipping). Instead of a separate field, attach a prefiller to each address line sourced from its billing counterpart, gated behind a "same as billing" toggle (dependsOn/hideWhen). When the toggle is off, the prefiller should be inert.

Pair with Nova's native dependsOn (Nova 4+). dependsOn handles visibility/options reactivity; this package handles value copying. They compose fine, but test them together — conditional field rendering is where prefill silently stops working (see Gotchas).

Non-Nova surfaces. If you also have a plain Blade/Filament/Inertia admin form, do not expect parity. Reimplement with Alpine (x-on:input setting the target) — it's ~10 lines and you control it.

Gotchas and Tips

Nova version compatibility is the big one. Last release 2023-08-04. Verify against your installed Nova major before doing anything else — install on a throwaway branch, load a resource, check the browser console for a Vue component registration error. If the component fails to register, the field renders blank and no obvious server-side error appears.

Prefill is client-side only. The value lives in the form state, not the request, until the user saves. If a field is readonly, hidden, or otherwise excluded from the payload, the "prefilled" value never reaches the server. Always back it with a model-side default as shown above.

Source field must be in the same form and mounted. Conditional containers (hideWhen, dependsOn, panels that render lazily, Field::make()->onlyOnDetail()) can unmount the source field. When the source isn't mounted, no reactive event fires and the prefill appears to "randomly" stop working. Debug by toggling the condition off first.

Non-string sources are unreliable. Selects, BelongsTo (relatable), date pickers, and file fields often emit objects/arrays rather than strings. Copying from a Select usually needs a small custom mapping — easier to fork the Vue component than to fight it.

Debugging workflow: Browser devtools → Vue devtools → find the field component → inspect its props and the watcher. Almost every bug here is "watcher never fired" (source not matched) or "watcher fired but target already had a value" (overwrite guard). Console-log the source value in the component to confirm the wiring.

Extension point / escape hatch: publish or copy resources/js/fields/ into your app, adjust, and npm run prod inside Nova. That's the supported way to change behavior. A lighter hack is Nova::script() to inject a snippet that listens for input on the source and sets the target — fine for a one-off, ugly at scale.

Consider the alternative before adopting. Nova itself and the broader ecosystem (slug fields, dependsOn, observers) cover most of these cases. Given 2 stars and 0 dependents, the honest recommendation is: read this package for the pattern, copy the ~100 lines of Vue into your own field, and skip the dependency. You'll get the same UX, own the maintenance, and stay compatible with future Nova releases.