Merge branch 'fix/expand-validation-error' into 3.x

filamentphp · Dec 13, 2023 · 81077f5 · 81077f5
2 parents d3ea0d5 + 7ca4c57
commit 81077f5
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 8 deletions.
diff --git a/packages/forms/resources/views/component-container.blade.php b/packages/forms/resources/views/component-container.blade.php
@@ -7,7 +7,7 @@
 
 <x-filament::grid
     :x-data="$isRoot ? '{}' : null"
-    :x-on:expand-concealing-component.window="
+    :x-on:form-validation-error.window="
         $isRoot ? ('
                 if ($event.detail.livewireId !== ' . Js::from($this->getId()) . ') {
                     return
@@ -30,7 +30,7 @@
 
                     setTimeout(
                         () =>
-                            error.scrollIntoView({
+                            error.closest(\'[data-field-wrapper]\').scrollIntoView({
                                 behavior: \'smooth\',
                                 block: \'start\',
                                 inline: \'start\',

diff --git a/packages/forms/resources/views/components/field-wrapper/index.blade.php b/packages/forms/resources/views/components/field-wrapper/index.blade.php
@@ -51,7 +51,7 @@
     $hasError = filled($statePath) && ($errors->has($statePath) || ($hasNestedRecursiveValidationRules && $errors->has("{$statePath}.*")));
 @endphp
 
-<div {{ $attributes->class(['fi-fo-field-wrp']) }}>
+<div data-field-wrapper {{ $attributes->class(['fi-fo-field-wrp']) }}>
     @if ($label && $labelSrOnly)
         <label for="{{ $id }}" class="sr-only">
             {{ $label }}

diff --git a/packages/forms/src/Concerns/InteractsWithForms.php b/packages/forms/src/Concerns/InteractsWithForms.php
@@ -172,7 +172,7 @@ public function validate($rules = null, $messages = [], $attributes = []): array
         } catch (ValidationException $exception) {
             $this->onValidationError($exception);
 
-            $this->dispatch('expand-concealing-component', livewireId: $this->getId());
+            $this->dispatch('form-validation-error', livewireId: $this->getId());
 
             throw $exception;
         }
@@ -193,7 +193,7 @@ public function validateOnly($field, $rules = null, $messages = [], $attributes
         } catch (ValidationException $exception) {
             $this->onValidationError($exception);
 
-            $this->dispatch('expand-concealing-component', livewireId: $this->getId());
+            $this->dispatch('form-validation-error', livewireId: $this->getId());
 
             throw $exception;
         }

diff --git a/packages/panels/dist/theme.css b/packages/panels/dist/theme.css
diff --git a/packages/panels/resources/css/index.css b/packages/panels/resources/css/index.css
@@ -12,7 +12,7 @@
     }
 
     /* When scrolling to validation error, do not hide element behind the top bar */
-    [data-validation-error] {
-        scroll-margin-top: 10rem;
+    [data-field-wrapper] {
+        scroll-margin-top: 8rem;
     }
 }