Add an illustration slot to the empty state

An application with its own artwork for an empty collection puts it in
the `illustration` slot, which is drawn in place of the shape and icon.
The slot's attributes go on the element around it, so its class sets the
colour an SVG's currentColor takes. A slot holding only whitespace or
comments counts as empty (hasActualContent), and without the slot the
empty state renders as before.

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

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

@@ -66,6 +66,22 @@
                 </x-slot:actions>
             </x-empty-state>
             BLADE,
+        'Empty state with an illustration' => <<<'BLADE'
+            <x-empty-state title="No routes yet" description="Draw a route on the map, or import one from a GPX file." class="w-full">
+                <x-slot:illustration class="text-primary">
+                    <svg class="size-32" viewBox="0 0 120 120" fill="none" aria-hidden="true">
+                        <circle cx="60" cy="60" r="56" class="fill-primary-container" />
+                        <path d="M28 86C40 62 56 92 68 64S86 42 90 46" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-dasharray="1 10" />
+                        <circle cx="28" cy="86" r="7" fill="currentColor" />
+                        <path d="M90 18a12 12 0 0 1 12 12c0 10-12 22-12 22S78 40 78 30a12 12 0 0 1 12-12Z" class="fill-tertiary" />
+                        <circle cx="90" cy="30" r="4" class="fill-on-tertiary" />
+                    </svg>
+                </x-slot:illustration>
+                <x-slot:actions>
+                    <x-button label="Draw a route" icon="route" variant="filled" />
+                </x-slot:actions>
+            </x-empty-state>
+            BLADE,
     ];
 @endphp