pboivin/filament-peek

Full-screen page preview modal for Filament

v2.2.10 2024-10-15 17:06 UTC

Requires

• php: ^8.1
• filament/filament: ^3.0
• illuminate/contracts: ^10.0 || ^11.0
• spatie/laravel-package-tools: ^1.15

Requires (Dev)

• laravel/pint: ^1.0
• nunomaduro/collision: ^7.9
• nunomaduro/larastan: ^2.0
• orchestra/testbench: ^8.0
• pestphp/pest: ^2.0
• pestphp/pest-plugin-arch: ^2.0
• pestphp/pest-plugin-laravel: ^2.0
• phpstan/extension-installer: ^1.1
• phpstan/phpstan-deprecation-rules: ^1.0
• phpstan/phpstan-phpunit: ^1.0
• spatie/invade: ^1.1
• symfony/polyfill-php82: ^1.28

MIT

• Patrick Boivin

• plugin
• laravel
• modal
• preview
• previewer
• filament

README

A Filament plugin to add a full-screen preview modal to your Panel pages. The modal can be used before saving to preview a modified record.

Installation

You can install the package via composer:

composer require pboivin/filament-peek:"^2.0"

Register a FilamentPeekPlugin instance in your Panel provider:

use Pboivin\FilamentPeek\FilamentPeekPlugin;

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

Then, publish the assets:

php artisan filament:assets

Upgrading from 1.x

Follow the steps in the Upgrade Guide.

Compatibility

Please feel free to report any issues you encounter with Peek in this repository. I'll work with you to determine where the issue is coming from.

Demo Projects

Here are a few example projects available to give this plugin a try:

Documentation

The documentation is available in the 'docs' directory on GitHub:

• Configuration
  • Publishing the Config File
  • Available Options
  • Integrating With a Custom Theme
• Page Previews
  • Overview
  • Using the Preview Modal on Edit pages
  • Using the Preview Modal on List pages
  • Detecting the Preview Modal
  • Using a Preview URL
  • Embedding a Preview Action into the Form
  • Preview Pointer Events
  • Adding Extra Data to Previews
  • Alternate Templating Engines
• Builder Previews
  • Overview
  • Using Builder Previews on Edit pages
  • Using Multiple Builder Fields
  • Using Custom Fields
  • Customizing the Preview Action
  • Automatically Updating the Builder Preview
  • Adding Extra Data to the Builder Editor State
  • Adding Extra Data to the Builder Preview
  • Alternate Templating Engines
• JavaScript Hooks
• Upgrading from v1.x

FAQ and Known Issues

I've started compiling some notes and solutions to common issues in Discussions. Feel free to contribute your own tips and tricks.

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

• Patrick Boivin
• All Contributors

Acknowledgements

The initial idea is heavily inspired by module previews in Twill CMS.

License

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