Filament Diffs

Syntax-highlighted file viewing and visual diff rendering for Filament infolists. Powered by @pierre/diffs.

#Components

#FileEntry

Renders any text-based content with syntax highlighting. Useful for displaying raw file contents, stored code, API payloads, or any structured text directly in an infolist.

#FileDiffEntry

Renders a side-by-side diff between two versions of content with syntax highlighting. Useful for comparing model versions, reviewing changes, or showing before/after states.

#Requirements

• PHP 8.1+
• Filament 3.x, 4.x, or 5.x

#Installation

composer require kirschbaum-development/filament-diffs -W

Then register the plugin in your panel provider:

use Kirschbaum\FilamentDiffs\FilamentDiffsPlugin;

public function panel(Panel $panel): Panel
{
    return $panel
        ->plugins([
            FilamentDiffsPlugin::make(),
        ]);
}

#Usage

#FileEntry

Use FileEntry in any infolist to render a field's value with syntax highlighting. The state is resolved from the record attribute matching the entry name:

use Kirschbaum\FilamentDiffs\Infolists\Components\FileEntry;

FileEntry::make('webhook_payload')
    ->label('Webhook Payload')
    ->fileName('payload.json')

You can override the state entirely using a closure:

FileEntry::make('webhook_payload')
    ->label('Webhook Payload')
    ->fileName('payload.json')
    ->state(fn ($record) => $record->getRawPayload())

#FileDiffEntry

Use FileDiffEntry to render a side-by-side diff between two strings. Both ->old() and ->new() accept a string or a closure that receives the current record. A null value is treated as an empty string, making it easy to represent newly created files.

use Kirschbaum\FilamentDiffs\Infolists\Components\FileDiffEntry;

FileDiffEntry::make('content')
    ->label('Changes')
    ->fileName('post.md')
    ->old(fn ($record) => $record->previousVersion?->content)
    ->new(fn ($record) => $record->content)

#Setting the Language

Both components detect the syntax highlighting language from the file name. You can also set it explicitly using any Shiki language identifier — this takes precedence over file name detection:

FileEntry::make('source')
    ->language('php')

FileDiffEntry::make('content')
    ->old(fn ($record) => $record->previousVersion?->content)
    ->new(fn ($record) => $record->content)
    ->language('markdown')

#Passing Options

Both components accept an ->options() array that is passed directly to the underlying @pierre/diffs components, giving you access to the full range of configuration including themes, diff styles, and more:

FileEntry::make('source')
    ->fileName('app.php')
    ->options([
        'theme' => 'github-dark',
    ])

FileDiffEntry::make('content')
    ->old(fn ($record) => $record->previousVersion?->content)
    ->new(fn ($record) => $record->content)
    ->fileName('post.md')
    ->options([
        'diffStyle' => 'unified',
    ])

See the @pierre/diffs documentation for all available options.

#Configuration

#Default Theme

Publish the config file to set a default theme across all components in your application:

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

// config/filament-diffs.php
return [
    'default_theme' => null,
];

You can also set a default theme per panel via the plugin, which takes precedence over the config file:

FilamentDiffsPlugin::make()
    ->defaultTheme('github-dark')

#Theme Precedence

Themes are resolved in the following order (highest priority first):

1. Per-component ->options(['theme' => '...'])
2. Panel plugin FilamentDiffsPlugin::make()->defaultTheme('...')
3. Config file filament-diffs.default_theme

#Testing

composer test

#Changelog

Please see CHANGELOG for more information on what has changed recently.

#Contributing

Please see CONTRIBUTING for details.

#Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

#Credits

• Travis Obregon
• Kirschbaum Development Group
• @pierre/diffs by The Pierre Computer Co.
• All Contributors

#Sponsorship

Development of this package is sponsored by Kirschbaum Development Group, a developer driven company focused on problem solving, team building, and community. Learn more about us or join us!

#License

The MIT License (MIT). Please see License File for more information.