Resolve the package's own components through its namespace

Package views now write <x-livewire-material::button>, so a configured
prefix (which Blade spells <x-m::button>) and an application component
of the same name can no longer break or shadow them. The showcase
rewrites its examples to the configured prefix. Adds the README, and
waits for the adaptive rail to hear a resize before the navigation
tests press its menu button.

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

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

@@ -76,7 +76,7 @@
                 <x-button icon="format_underlined" aria-label="Underline" variant="tonal" :selected="false" />
             </x-button-group>
             BLADE,
-        'A choice as a connected group (<x-group>)' => <<<'BLADE'
+        'A choice as a connected group' => <<<'BLADE'
             <div x-data="{ theme: 'system', days: ['mon'] }" class="grid w-full gap-6 md:grid-cols-2">
                 <x-group label="Theme" name="showcase-theme" x-model="theme" :options="[
                     ['id' => 'light', 'name' => 'Light', 'icon' => 'light_mode'],

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

@@ -24,7 +24,7 @@
 
     <div class="flex flex-wrap items-center gap-4">
         <label class="flex min-w-72 flex-1 items-center gap-2 rounded-corner-xs border border-outline px-3 py-2 focus-within:outline-3 focus-within:outline-secondary">
-            <x-icon name="search" class="size-5 text-on-surface-variant" />
+            <x-livewire-material::icon name="search" class="size-5 text-on-surface-variant" />
             <input type="search" x-model.debounce.150ms="query" placeholder="Search {{ number_format(count(\NoNameWeb\LivewireMaterial\Support\SvgFile::symbolNames())) }} symbols" class="w-full bg-transparent type-body-lg outline-none" />
         </label>
 

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

@@ -8,9 +8,9 @@
 
     <div class="flex flex-wrap items-center gap-2">
         @foreach (['401', '402', '403', '404', '419', '429', '500', '503'] as $code)
-            <x-button :link="route('livewire-material.error', $code)" :label="$code" variant="tonal" no-wire-navigate />
+            <x-livewire-material::button :link="route('livewire-material.error', $code)" :label="$code" variant="tonal" no-wire-navigate />
         @endforeach
 
-        <x-button :link="route('livewire-material.mail')" label="Sample mail" icon="mail" variant="outlined" no-wire-navigate />
+        <x-livewire-material::button :link="route('livewire-material.mail')" label="Sample mail" icon="mail" variant="outlined" no-wire-navigate />
     </div>
 </section>

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

@@ -17,7 +17,7 @@
     <div class="grid grid-cols-3 gap-4 sm:grid-cols-5 lg:grid-cols-7">
         @foreach (\NoNameWeb\LivewireMaterial\Support\SvgFile::shapeNames() as $shape)
             <div class="space-y-2 text-center">
-                <x-shape :name="$shape" class="mx-auto size-20 text-secondary-container" />
+                <x-livewire-material::shape :name="$shape" class="mx-auto size-20 text-secondary-container" />
                 <code class="type-label-md text-on-surface-variant">{{ $shape }}</code>
             </div>
         @endforeach