README

A lightweight Filament plugin that adds draggable behavior to modal dialogs, enhancing user experience by allowing users to reposition modals anywhere on the screen.

Features

✨ Drag & Drop Modals - Click and drag modal headers to reposition them
🎯 Smart Boundaries - Modals stay within viewport bounds
⚡ Lightweight - Minimal JavaScript with no external dependencies
🎨 Seamless Integration - Works with all Filament modal types (Actions, Forms, Tables)
📱 Touch Support - Works on touch devices
🔧 Zero Configuration - Works out of the box after installation

Requirements

• PHP 8.2 or higher
• Filament 4.0 or 5.0
• Laravel 11.0 or 12.0

Installation

You can install the package via composer:

composer require athul-suresh/filament-draggable-modal

Usage

Basic Setup

Simply register the plugin in your Filament panel configuration:

use AthulSuresh\FilamentDraggableModal\FilamentDraggableModalPlugin;

public function panel(Panel $panel): Panel
{
    return $panel
        ->id('admin')
        ->plugins([
            FilamentDraggableModalPlugin::make(),
        ]);
}

That's it! All modals in your Filament panel are now draggable.

How It Works

Once installed, users can:

1. Click on any modal header
2. Drag the modal to a new position
3. Release to drop it in place

The modal will remember its position during the session and automatically reset when closed.

Multiple Panels

The plugin works seamlessly with multiple panels:

// Admin Panel
public function adminPanel(Panel $panel): Panel
{
    return $panel
        ->id('admin')
        ->plugins([
            FilamentDraggableModalPlugin::make(),
        ]);
}

// App Panel
public function appPanel(Panel $panel): Panel
{
    return $panel
        ->id('app')
        ->plugins([
            FilamentDraggableModalPlugin::make(),
        ]);
}

Compatibility

This plugin is compatible with all Filament modal types:

• Action Modals
• Form Modals
• Table Action Modals
• Custom Modals
• Slide-overs (when configured as modals)

Testing

Run the test suite with:

composer test

Run tests with coverage:

vendor/bin/pest --coverage

Format code with Laravel Pint:

composer format

Troubleshooting

Publish the assets if modals are not draggable after installation.

Inspired By

This plugin was inspired by the work of sanzgrapher. Special thanks for the inspiration and concept!

Changelog

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

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Security

If you discover any security related issues, please email athulsuresh198@gmail.com instead of using the issue tracker.

Credits

• Athul Suresh
• Inspired by sanzgrapher
• All Contributors

License

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