akunbeben/fluid-actions
Fluid Actions is a UX toolkit for Filament Actions, offering inline confirmation, hold-to-confirm gestures, and ActionGroup support with per-action timeouts and smart fallbacks to Filament's default behavior.
Make Filament Actions feel fluid.
Fluid Actions is a UX toolkit for Filament Actions. It provides beautiful, flexible interaction components that help you design action flows that feel more intentional, contextual, and delightful.
Actions should match the context in which they are used. Some actions need confirmation, some need hesitation, some need quick feedback, and some should stay lightweight. Fluid Actions gives you more ways to shape those interactions.
Install the package via Composer:
composer require akunbeben/fluid-actions
Register the plugin in your Filament panel:
use Akunbeben\FluidActions\FluidActionsPlugin;
$panel
->plugin(FluidActionsPlugin::make());
Use inline confirmation when an action needs explicit confirmation, but the interaction should stay lightweight and close to the action itself.
use Filament\Actions\Action;
Action::make('deactivate')
->color('danger')
->requiresConfirmation()
->inlineConfirmation();
inlineConfirmation()does not callrequiresConfirmation()for you. You must explicitly use both methods.
The inline confirmation button uses Filament's modal submit action label.
Action::make('deactivate')
->color('danger')
->requiresConfirmation()
->modalSubmitActionLabel('Confirm')
->inlineConfirmation(timeout: 3000);
The timeout is in milliseconds. The default is 3000.
Use hold-to-confirm when an action should require a more deliberate gesture before it executes.
use Filament\Actions\Action;
Action::make('delete')
->color('danger')
->holdToConfirm();
By default, the user must hold the action for 1500 milliseconds.
Action::make('delete')
->color('danger')
->holdToConfirm(duration: 3000);
Unlike inline confirmation, holdToConfirm() does not require requiresConfirmation().
Fluid Actions supports actions inside dropdowns and button groups.
use Filament\Actions\Action;
use Filament\Actions\ActionGroup;
ActionGroup::make([
Action::make('edit')
->label('Edit'),
Action::make('delete')
->label('Delete')
->color('danger')
->requiresConfirmation()
->inlineConfirmation(),
]);
When an inline confirmation action is triggered inside a dropdown, the dropdown stays open so the confirmation state can be shown. After confirmation, the action executes and the dropdown closes.
You can control whether a grouped action closes its dropdown after confirmation.
Action::make('delete')
->requiresConfirmation()
->inlineConfirmation(closeDropdown: false);
You may also pass a closure:
Action::make('delete')
->requiresConfirmation()
->inlineConfirmation(
closeDropdown: fn (): bool => auth()->user()->prefers_compact_actions,
);
The same option is available for hold-to-confirm:
Action::make('delete')
->holdToConfirm(closeDropdown: false);
Fluid Actions is designed to enhance simple action interactions without breaking Filament's built-in action flows. If an action needs Filament's modal or submit behavior, it automatically falls back to the original Filament action rendering.
Actions fall back when they have:
For inline confirmation, the action must also use requiresConfirmation().
composer test
Run static analysis:
composer analyse
Please see CHANGELOG for more information on what has changed recently.
Please see CONTRIBUTING for details.
Please review our security policy on how to report security vulnerabilities.
The MIT License (MIT). Please see License File for more information.
How can I help you explore Laravel packages today?