diff --git a/packages/actions/resources/views/action-modal.blade.php b/packages/actions/resources/views/action-modal.blade.php index c819ca99b6a..765248e09af 100644 --- a/packages/actions/resources/views/action-modal.blade.php +++ b/packages/actions/resources/views/action-modal.blade.php @@ -6,6 +6,7 @@ $actionIsModalAutofocused = $action->isModalAutofocused(); $actionHasModalCloseButton = $action->hasModalCloseButton(); $actionIsModalClosedByClickingAway = $action->isModalClosedByClickingAway(); + $actionIsModalClickThrough = $action->isModalClickThrough(); $actionIsModalClosedByEscaping = $action->isModalClosedByEscaping(); $actionModalDescription = $action->getModalDescription(); $actionExtraModalWindowAttributeBag = $action->getExtraModalWindowAttributeBag(); @@ -30,6 +31,7 @@ :autofocus="$actionIsModalAutofocused" :close-button="$actionHasModalCloseButton" :close-by-clicking-away="$actionIsModalClosedByClickingAway" + :click-through="$actionIsModalClickThrough" :close-by-escaping="$actionIsModalClosedByEscaping" :description="$actionModalDescription" :extra-modal-window-attribute-bag="$actionExtraModalWindowAttributeBag" diff --git a/packages/actions/src/Concerns/CanOpenModal.php b/packages/actions/src/Concerns/CanOpenModal.php index a067fe9e475..4f7389ccedb 100644 --- a/packages/actions/src/Concerns/CanOpenModal.php +++ b/packages/actions/src/Concerns/CanOpenModal.php @@ -87,6 +87,8 @@ trait CanOpenModal protected bool | Closure | null $isModalClosedByClickingAway = null; + protected bool | Closure | null $isModalClickThrough = null; + protected bool | Closure | null $isModalClosedByEscaping = null; protected bool | Closure | null $isModalAutofocused = null; @@ -105,6 +107,13 @@ public function closeModalByClickingAway(bool | Closure | null $condition = true return $this; } + public function modalClickThrough(bool | Closure | null $condition = true): static + { + $this->isModalClickThrough = $condition; + + return $this; + } + public function closeModalByEscaping(bool | Closure | null $condition = true): static { $this->isModalClosedByEscaping = $condition; @@ -706,6 +715,11 @@ public function isModalClosedByClickingAway(): bool return (bool) ($this->evaluate($this->isModalClosedByClickingAway) ?? ModalComponent::$isClosedByClickingAway); } + public function isModalClickThrough(): bool + { + return (bool) ($this->evaluate($this->isModalClickThrough) ?? ModalComponent::$isModalClickThrough); + } + public function isModalClosedByEscaping(): bool { return (bool) ($this->evaluate($this->isModalClosedByEscaping) ?? ModalComponent::$isClosedByEscaping); diff --git a/packages/support/resources/views/components/modal/index.blade.php b/packages/support/resources/views/components/modal/index.blade.php index a6594f207b1..8f5dd2a7a3d 100644 --- a/packages/support/resources/views/components/modal/index.blade.php +++ b/packages/support/resources/views/components/modal/index.blade.php @@ -12,6 +12,7 @@ 'autofocus' => \Filament\Support\View\Components\ModalComponent::$isAutofocused, 'closeButton' => \Filament\Support\View\Components\ModalComponent::$hasCloseButton, 'closeByClickingAway' => \Filament\Support\View\Components\ModalComponent::$isClosedByClickingAway, + 'clickThrough' => false, 'closeByEscaping' => \Filament\Support\View\Components\ModalComponent::$isClosedByEscaping, 'closeEventName' => 'close-modal', 'closeQuietlyEventName' => 'close-modal-quietly', @@ -61,6 +62,7 @@ $wireSubmitHandler = $attributes->get('wire:submit.prevent'); $attributes = $attributes->except(['wire:submit.prevent']); + $isClickThrough = $clickThrough && ! $closeByClickingAway; @endphp @if ($trigger) @@ -113,7 +115,9 @@ }" x-cloak x-show="isOpen" - x-trap.noscroll{{ $autofocus ? '' : '.noautofocus' }}="isOpen" + @unless ($isClickThrough) + x-trap.noscroll{{ $autofocus ? '' : '.noautofocus' }}="isOpen" + @endunless {{ $attributes->class([ 'fi-modal', @@ -124,19 +128,22 @@ 'fi-modal-has-sticky-header' => $stickyHeader, 'fi-modal-has-sticky-footer' => $stickyFooter, 'fi-width-screen' => $width === Width::Screen, + 'pointer-events-none' => $isClickThrough, ]) }} > - + @unless ($isClickThrough) + + @endunless
$closeByClickingAway, + 'pointer-events-none' => $isClickThrough, ]) > <{{ filled($wireSubmitHandler) ? 'form' : 'div' }} diff --git a/packages/support/src/View/Components/ModalComponent.php b/packages/support/src/View/Components/ModalComponent.php index 6b99e5d7316..3b515addbf9 100644 --- a/packages/support/src/View/Components/ModalComponent.php +++ b/packages/support/src/View/Components/ModalComponent.php @@ -10,6 +10,8 @@ class ModalComponent public static bool $isClosedByEscaping = true; + public static bool $isModalClickThrough = false; + public static bool $isAutofocused = true; public static function autofocus(bool $condition = true): void @@ -31,4 +33,9 @@ public static function closedByEscaping(bool $condition = true): void { static::$isClosedByEscaping = $condition; } + + public static function modalClickThrough(bool $condition = true): void + { + static::$isModalClickThrough = $condition; + } }