From cd155da12ce278b70bcb8060386bf5bbdaa98013 Mon Sep 17 00:00:00 2001
From: Caleb Porzio <calebporzio@gmail.com>
Date: Sat, 4 Jul 2026 08:16:43 -0400
Subject: [PATCH] Apply attributes to the root element of text separators

When a separator has text, the attribute bag was forwarded to the two
inner line divs instead of the component's root element. Directives
like wire:transition ended up on the lines, so the lines animated but
the text (and the element itself) did not.

Apply the attribute bag to the root container instead, and leave the
line divs as internal decoration.

Fixes #2555

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 stubs/resources/views/flux/separator.blade.php | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/stubs/resources/views/flux/separator.blade.php b/stubs/resources/views/flux/separator.blade.php
index 51985e73..0d2fc038 100644
--- a/stubs/resources/views/flux/separator.blade.php
+++ b/stubs/resources/views/flux/separator.blade.php
@@ -24,12 +24,12 @@
 @endphp
 
 <?php if ($text): ?>
-    <div data-orientation="{{ $orientation }}" class="flex items-center w-full" role="none" data-flux-separator>
-        <div {{ $attributes->class([$classes, 'grow']) }}></div>
+    <div data-orientation="{{ $orientation }}" role="none" {{ $attributes->class('flex items-center w-full') }} data-flux-separator>
+        <div class="{{ $classes }} grow"></div>
 
         <span class="shrink mx-6 font-medium text-sm text-zinc-500 dark:text-zinc-300 whitespace-nowrap">{{ $text }}</span>
 
-        <div {{ $attributes->class([$classes, 'grow']) }}></div>
+        <div class="{{ $classes }} grow"></div>
     </div>
 <?php else: ?>
     <div data-orientation="{{ $orientation }}" role="none" {{ $attributes->class($classes, 'shrink-0') }} data-flux-separator></div>