Cluster menu items by a gap, as Expressive does

Plan step 22, actions.md § Missing (Grouped menu layout by gap): M3
Expressive's "Grouped" layout separates clusters with a gap rather than a
divider, and `<x-menu-group>` only had the labelled form.

`<x-menu-group gap>` holds its items in a box 2px apart
(SegmentedMenuTokens.SegmentedGap) whose ends round like a list's, and
stands 8px off its neighbours — the same 8px the separator keeps around
its line. `label` is now optional, so a cluster can be a gap alone. The
header says when to reach for which: the divider first, and always in a
menu long enough to scroll, where M3 says gaps are unsupported.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9

resources/views/showcase/sections/menus.blade.php

@@ -60,6 +60,37 @@
                 <x-menu-item label="Delete" icon="delete" />
             </x-menu>
             BLADE,
+        'Clusters: a gap, or a divider' => <<<'BLADE'
+            <x-menu label="Grouped by a gap">
+                <x-slot:trigger>
+                    <x-button label="A gap" icon-right="arrow_drop_down" variant="outlined" />
+                </x-slot:trigger>
+
+                <x-menu-group gap>
+                    <x-menu-item label="Cut" icon="content_cut" shortcut="⌘X" />
+                    <x-menu-item label="Copy" icon="content_copy" shortcut="⌘C" />
+                    <x-menu-item label="Paste" icon="content_paste" shortcut="⌘V" />
+                </x-menu-group>
+
+                <x-menu-group label="Then" gap>
+                    <x-menu-item label="Rename" icon="edit" />
+                    <x-menu-item label="Delete" icon="delete" />
+                </x-menu-group>
+            </x-menu>
+
+            <x-menu label="Separated by a divider">
+                <x-slot:trigger>
+                    <x-button label="A divider" icon-right="arrow_drop_down" variant="outlined" />
+                </x-slot:trigger>
+
+                <x-menu-item label="Cut" icon="content_cut" shortcut="⌘X" />
+                <x-menu-item label="Copy" icon="content_copy" shortcut="⌘C" />
+                <x-menu-item label="Paste" icon="content_paste" shortcut="⌘V" />
+                <x-menu-separator />
+                <x-menu-item label="Rename" icon="edit" />
+                <x-menu-item label="Delete" icon="delete" />
+            </x-menu>
+            BLADE,
         'Icons in their own colour' => <<<'BLADE'
             <x-menu label="New plan">
                 <x-slot:trigger>