From 4d4862189add32e866e9610ed6b6979679547aa3 Mon Sep 17 00:00:00 2001
From: Andreas Reinhold / reini <reini@kadenpartner.ch>
Date: Mon, 14 Sep 2026 05:54:09 +0200
Subject: [PATCH] Mark a FAB's root with data-fab

A FAB nested in another component has to be restyled from that component's
stylesheet, and its root carried no hook. Added here rather than with the rule
that needs it, so the actions stream's own use of the hook merges cleanly.
Plan: docs/plans/material-3-alignment.md, step 14 (navigation N-03).

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
---
 resources/views/components/fab.blade.php | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/resources/views/components/fab.blade.php b/resources/views/components/fab.blade.php
index 91c02076..a074052a 100644
--- a/resources/views/components/fab.blade.php
+++ b/resources/views/components/fab.blade.php
@@ -9,6 +9,9 @@
      `<div class="fixed end-4 bottom-4"><x-fab icon="add" tooltip="New share" /></div>`. For a
      create action that is a FAB on a phone and a header button above, use `<x-button fab>`.
 
+     `data-fab` marks the root, so a component that nests a FAB can restyle it from its own
+     stylesheet — a rail drops its elevation to 0, as M3 asks of a nested FAB.
+
      Sizes, corners and elevation from FabBaseline/Medium/LargeTokens and ExtendedFab*Tokens
      (androidx Compose Material 3, Apache-2.0). --}}
 
@@ -63,7 +66,7 @@
         ], fn ($value): bool => $value !== null));
 @endphp
 
-<{{ $tag }} {{ $attributes }}>
+<{{ $tag }} data-fab {{ $attributes }}>
     @if ($icon)
         <x-livewire-material::icon :name="$icon" :class="$iconSize" />
     @endif